🐛 post-upgrade fixes

src/adjuster/adjuster-legend.service.ts

@@ -78,6 +78,7 @@ export class AdjusterLegendService {
     nuts3IndexLayer.set('popUp', {
       attributes: attrs,
     });
+    //nuts3IndexLayer?.getSource()?.getFeatures()?.[0]?.dispatchEvent('change');
   }
 
   //FIXME: how to do this??

src/adjuster/adjuster.component.html

@@ -23,6 +23,26 @@
       <div class="text-warning pt-2" [hidden]="!noDataSelected() || errorMsg">{{'ADJUSTER.noDataSelectedMsg' | translate}}</div>
       <div class="text-danger pt-2" [hidden]="!errorMsg">{{'ADJUSTER.serverError' | translate}}: {{errorMsg}}</div>
     </div>
+    <div class="p-2 center-block">
+      {{'ADJUSTER.myRoleIs' | translate}}:&emsp;
+      <select class="form-select" [(ngModel)]="adjusterPresetsService.activeRole" (ngModelChange)="adjusterPresetsService.pickProblem($event)">
+        <option *ngFor="let role of adjusterPresetsService.roles" [ngValue]="role">{{getLabelInCurrentLang(role.labels)}}</option>
+      </select>
+      {{'ADJUSTER.myProblemIs' | translate}}:&emsp;
+      <select class="form-select" [(ngModel)]="adjusterPresetsService.activeProblem" (ngModelChange)="adjusterPresetsService.applyProblem($event)">
+        <option *ngFor="let problem of adjusterPresetsService.getActiveRoleProblems()" [ngValue]="problem">{{getLabelInCurrentLang(problem.labels)}}</option>
+      </select>
+    </div>
+    <button class="btn btn-secondary btn-sm" aria-expanded="false" aria-controls="advancedOptions" (click)="showAdvancedOptions = !showAdvancedOptions">
+      <span class="glyphicon cursor-pointer" [ngClass]="showAdvancedOptions ? 'icon-chevron-down' : 'icon-chevron-right'"></span>
+      {{'ADJUSTER.advanced' | translate}}
+    </button>
+    <div class="p-2 center-block" [hidden]="!showAdvancedOptions">
+      {{'ADJUSTER.classifyBySchema' | translate}}:&emsp;
+      <select class="form-select" [(ngModel)]="adjusterPresetsService.activeSchema" (ngModelChange)="adjusterPresetsService.changeSchema($event)">
+        <option *ngFor="let schema of adjusterPresetsService.schemas" [ngValue]="schema">{{getLabelInCurrentLang(schema.labels)}}</option>
+      </select>
+    </div>
     <div class="p-2 center-block" [hidden]="!adjusterService.allowClusters">
       <div class="pt-2 text-secondary">{{'ADJUSTER.numberOfClusters' | translate}}: {{adjusterService.numberOfClusters}}</div>
       <input type="range" class="custom-range" [(ngModel)]="adjusterService.numberOfClusters" min="5" max="15" step="1">

src/adjuster/adjuster.service.ts

@@ -19,7 +19,7 @@ import {
 } from './attractiveness-clusters.service';
 import {AttractivenessIndexService} from './attractiveness-index.service';
 import {RDFSubject} from './ontology.model';
-import {nuts} from '../nuts';
+import {nuts3IndexSource} from '../app.config';
 
 @Injectable({providedIn: 'root'})
 export class AdjusterService {
@@ -180,6 +180,7 @@ export class AdjusterService {
         type: 'index',
         err: error,
       });
+      return;
     }
     // Spread the 'aggregate' value between 0 and 1
     const min = attractivenessData.reduce((a, b) =>
@@ -202,7 +203,7 @@ export class AdjusterService {
     });
     console.time('forEach-Index');
     this.attractivenessIndexService.processIndex(
-      nuts.nuts3IndexSource,
+      nuts3IndexSource,
       codeRecordRelations
     );
     console.timeEnd('forEach-Index');
@@ -251,6 +252,7 @@ export class AdjusterService {
         type: 'clusters',
         err: error,
       });
+      return;
     }
     const clusterData = data.response;
     // Store relation between region and its data in a hash-table-like structure
@@ -301,7 +303,6 @@ export class AdjusterService {
   }
 
   async init(): Promise<void> {
-    console.log('init');
     this._loadInProcess = true;
     let data: any;
     try {
@@ -340,7 +341,6 @@ export class AdjusterService {
           };
         });
     });*/
-    console.log('init done, applying');
     this._loadInProcess = false;
     this.apply();
     // In HSL 2.5, setting layer greyscale breaks the print() functionality
@@ -348,7 +348,6 @@ export class AdjusterService {
   }
 
   async loadOntology() {
-    console.log('loading onto');
     try {
       const onto = await this.httpClient
         .get<RDFSubject[]>(this.serviceBaseUrl + 'ontology/')
@@ -364,7 +363,6 @@ export class AdjusterService {
       console.log(error);
       this._loadInProcess = false;
     }
-    console.log('onto loaded');
   }
 
   resetFactorWeights(factorId: string): number {

src/adjuster/dataset-list/dataset-list.component.ts

@@ -21,10 +21,12 @@ export class DatasetListComponent implements OnInit {
   ngOnInit() {}
 
   getLabelInCurrentLang(labels) {
-    //return this.adjusterPresetsService.getLabelInCurrentLang(labels);
+    return this.adjusterPresetsService.getLabelInCurrentLang(labels);
   }
 
   showMetadataWindow(dataset) {
-    //this.hsDialogContainerService.create(MetadataDialogComponent, {title: dataset.name});
+    this.hsDialogContainerService.create(MetadataDialogComponent, {
+      title: dataset.name,
+    });
   }
 }

src/adjuster/metadata-dialog/metadata-dialog.service.ts

@@ -11,19 +11,38 @@ export class MetadataDialogService {
   constructor(public adjusterPresetsService: AdjusterPresetsService) {
     this.ontology = this.adjusterPresetsService.ontology;
   }
-  
+
   loadDatasetMetadata(datasetName: string): DatasetDescriptor {
     console.log(this.ontology);
-    const ontoInfo = this.ontology.find((subject) => subject['http://www.w3.org/2000/01/rdf-schema#label']?.find((label) => label['@value']?.includes(datasetName)))
+    const ontoInfo = this.ontology.find((subject) =>
+      subject['http://www.w3.org/2000/01/rdf-schema#label']?.find((label) =>
+        label['@value']?.includes(datasetName)
+      )
+    );
     console.log(ontoInfo);
     //TODO: the returned values must reflect possibility of multi-values (e.g. coverage CZ + EU)
     return {
       title: datasetName,
-      coverage: ontoInfo['http://www.semanticweb.org/attractiveness/hasCoverage'][0]['@id'] ?? null,
-      link: ontoInfo['http://www.semanticweb.org/attractiveness/link'][0]['@value'] ?? null,
-      lod: ontoInfo['http://www.semanticweb.org/attractiveness/hasLoD'][0]['@id'] ?? null,
-      source: ontoInfo['http://www.semanticweb.org/attractiveness/hasSource'][0]['@id'] ?? null,
-      update: ontoInfo['http://www.semanticweb.org/attractiveness/update'][0]['@value'] ?? null
+      coverage:
+        ontoInfo['http://www.semanticweb.org/attractiveness/hasCoverage'][0][
+          '@id'
+        ] ?? null,
+      link:
+        ontoInfo['http://www.semanticweb.org/attractiveness/link'][0][
+          '@value'
+        ] ?? null,
+      lod:
+        ontoInfo['http://www.semanticweb.org/attractiveness/hasLoD'][0][
+          '@id'
+        ] ?? null,
+      source:
+        ontoInfo['http://www.semanticweb.org/attractiveness/hasSource'][0][
+          '@id'
+        ] ?? null,
+      update:
+        ontoInfo['http://www.semanticweb.org/attractiveness/update'][0][
+          '@value'
+        ] ?? null,
     };
   }
 }

src/app.config.ts

@@ -1,7 +1,7 @@
 import {Fill, Stroke, Style} from 'ol/style';
+import {GeoJSON} from 'ol/format';
 import {OSM, Vector as VectorSource} from 'ol/source';
 import {Tile, Vector as VectorLayer} from 'ol/layer';
-import {TopoJSON} from 'ol/format';
 import {View} from 'ol';
 
 import env from './env.config.json';
@@ -75,28 +75,46 @@ export const nuts2Layer = new VectorLayer({
   properties: {
     title: 'NUTS2 regions',
     editor: {editable: false},
+    queryable: false,
   },
   source: nuts.nuts2Source,
   visible: false,
   style: nuts2style,
 });
 
+export const nuts3IndexSource = new VectorSource({
+  //features: new GeoJSON().readFeatures(nuts3),
+  format: new GeoJSON(),
+  url: require('./data/NUTS_RG_20M_2016_3857_LEVL_3.geojson').default,
+  overlaps: false,
+});
+
 export const nuts3IndexLayer = new VectorLayer({
   properties: {
     title: 'NUTS3 regions: Rural attractiveness index',
     editor: {editable: false},
-    queryable: false,
+    autoLegend: false,
+    //queryable: false,
   },
-  source: nuts.nuts3IndexSource,
+  source: nuts3IndexSource,
   visible: true,
   style: indexStyle,
 });
+nuts3IndexLayer.set('popUp', {
+  attributes: [
+    {
+      attribute: 'aggregate',
+      label: 'aggregated',
+      displayFunction: decimal2prettyPerc,
+    },
+  ],
+});
 
 export const AppConfig = {
   assetsPath: 'assets/hslayers-ng',
   useProxy: false,
   //proxyPrefix: '/proxy/',
-  geonamesUser: env.geonamesUser,
+  geonamesUser: env.geonamesUser ?? '',
   default_layers: [
     new Tile({
       properties: {
@@ -146,7 +164,7 @@ export const AppConfig = {
   panelsEnabled: {
     composition_browser: false,
     feature_crossfilter: false,
-    info: false,
+    //info: false,
     saveMap: false,
     sensors: false,
     tracking: false,

src/app.service.ts

@@ -8,13 +8,16 @@ import {Geometry} from 'ol/geom';
 import {Vector as VectorLayer} from 'ol/layer';
 import {Vector as VectorSource} from 'ol/source';
 
-import {HsConfig} from 'hslayers-ng';
-import {HsEventBusService} from 'hslayers-ng';
-import {HsLanguageService} from 'hslayers-ng';
-import {HsLayoutService} from 'hslayers-ng';
-//import {HsMapService} from 'hslayers-ng/components/map/map.service';
-import {HsPanelContainerService} from 'hslayers-ng';
-import {HsSidebarService} from 'hslayers-ng';
+import {
+  HsConfig,
+  HsEventBusService,
+  HsLanguageService,
+  HsLayoutService,
+  //HsMapService,
+  HsPanelContainerService,
+  HsSidebarService,
+  HsToastService,
+} from 'hslayers-ng';
 
 import {AdjusterComponent} from './adjuster/adjuster.component';
 import {AdjusterEventService} from './adjuster/adjuster-event.service';
@@ -57,7 +60,8 @@ export class AppService {
     public hsLayoutService: HsLayoutService,
     //public hsMapService: HsMapService,
     public hsPanelContainerService: HsPanelContainerService,
-    public hsSidebarService: HsSidebarService
+    public hsSidebarService: HsSidebarService,
+    public hsToastService: HsToastService
   ) {
     this.hsSidebarService.buttons.push({
       panel: 'adjuster',
@@ -81,7 +85,6 @@ export class AppService {
       this.init();
     });
     this.hsEventBus.olMapLoads.subscribe(() => {
-      console.log('olMap loaded');
       this.ensureLayerIsLoaded(nuts3IndexLayer);
       for (const method of this.adjusterService.methods) {
         this.ensureLayerIsLoaded(method.layer);
@@ -122,17 +125,24 @@ export class AppService {
    * Create separate layer fo each clustering method and add it to default_layers
    */
   prepareLayers(): void {
-    console.log('loading layers...');
     for (const method of this.adjusterService.methods) {
       method.layer = new VectorLayer({
         properties: {
           editor: {editable: false},
-          queryable: false,
+          //queryable: false,
           autoLegend: false,
           title: `NUTS3 regions: ${method.name.replace(
             /\((.+?)\)/g,
             ''
           )} clusters`,
+          popUp: {
+            attributes: [
+              {
+                attribute: method.codename,
+                label: 'Cluster ID',
+              },
+            ],
+          },
         },
         source: new VectorSource({
           //features: new GeoJSON().readFeatures(nuts3).map((f) => f.clone()),
@@ -144,19 +154,21 @@ export class AppService {
         style: this.generateStyle(method.codename),
       });
       method.layer.getSource().on('featuresloadend', () => {
-        console.log(`featuresloadend of ${method.codename}`);
         this.adjusterEventService.layerReady.next({name: method.codename});
       });
-      method.layer.getSource().on('featuresloadstart', () => {
-        console.log(`loadstart of ${method.codename}`);
-      });
-      method.layer.getSource().on('featuresloaderror', () => {
+      method.layer.getSource().on('featuresloaderror', (evt) => {
+        this.hsToastService.createToastPopupMessage(
+          'Error loading layer',
+          // eslint-disable-next-line prettier/prettier
+          `The layer ${
+            (evt.target as VectorSource<Geometry>).get('title')
+            // eslint-disable-next-line prettier/prettier
+          } could not be loaded`,
+          {toastStyleClasses: 'bg-danger text-light'}
+        );
         console.log('evil shit');
       });
       AppConfig.default_layers.push(method.layer as any);
-      console.log(
-        `layer for method ${method.codename} (${method.name}) created`
-      );
     }
     /* The order of pushes matter! */
     AppConfig.default_layers.push(nuts3IndexLayer as any);
@@ -190,7 +202,6 @@ export class AppService {
     ];
     this.pilotRegions.set('queryable', false);
     this.hsConfig.update(AppConfig);
-    console.log('layers preapared');
   }
 
   /**

src/nuts.ts

@@ -9,12 +9,12 @@ export const nuts = {
     overlaps: false,
   }),
 
-  nuts3IndexSource: new VectorSource({
+  /*nuts3IndexSource: new VectorSource({
     //features: new GeoJSON().readFeatures(nuts3),
     format: new GeoJSON(),
     url: require('./data/NUTS_RG_20M_2016_3857_LEVL_3.geojson').default,
     overlaps: false,
-  }),
+  }),*/
 
   /*nuts3ClustersSource: new VectorSource({
     features: new GeoJSON().readFeatures(nuts3).map((f) => f.clone()),

src/translations.json

@@ -2,9 +2,11 @@
   "cs": {
     "ADJUSTER": {
       "adjustFactors": "Vyladit faktory",
+      "advanced": "Pokročilé",
       "calculate": "Vypočítat",
       "calcAttractivity": "Počítám atraktivitu",
       "calcClusters": "Počítám shluky",
+      "classifyBySchema": "Klasifikovat faktory dle schématu",
       "clusters": "Shluky",
       "index": "Index",
       "layerManagerLink1": "Vrstvy můžete prozkoumat",
@@ -12,18 +14,28 @@
       "layerManagerLinkLMName": "Správci vrstev",
       "loading": "Načítám",
       "loadingData": "Načítám data",
+      "myProblemIs": "a chci řešit problém",
+      "myRoleIs": "Moje role je",
       "noDataSelectedMsg":
         "Vyberte alespoň jednu datovou sadu a nastavte váhu aspoň jednoho faktoru na ne-nulovou hodnotu.",
       "numberOfClusters": "Počet shluků k vytvoření",
       "serverError": "Chyba serveru"
+    },
+    "METADATA": {
+      "coverage": "Pokrývá území",
+      "LoD": "Úroveň detailu",
+      "source": "Zdroj",
+      "update": "Aktualizace"
     }
   },
   "en": {
     "ADJUSTER": {
       "adjustFactors": "Adjust Factors",
+      "advanced": "Advanced",
       "calculate": "Calculate",
       "calcAttractivity": "Calculating attractivity",
       "calcClusters": "Calculating clusters",
+      "classifyBySchema": "Classify factors by schema",
       "clusters": "Clusters",
       "index": "Index",
       "layerManagerLink1": "You can investigate the layers",
@@ -31,9 +43,17 @@
       "layerManagerLinkLMName": "Layer Manager",
       "loading": "Loading",
       "loadingData": "Loading data",
+      "myProblemIs": "and I want to solve a problem with",
+      "myRoleIs": "My role is",
       "noDataSelectedMsg": "Select at least one dataset and set at least one factor's weight to a non-zero value.",
       "numberOfClusters": "Number of clusters to create",
       "serverError": "Server error"
+    },
+    "METADATA": {
+      "coverage": "Covers area",
+      "LoD": "Level of Detail",
+      "source": "Source",
+      "update": "Update"
     }
   }
 }