🐛 fix loader initialization

src/adjuster/adjuster-loader/adjuster-loader.component.html

@@ -1,8 +1,8 @@
-<div class="loader-splash" *ngIf="adjusterService.isInProcess()">
+<div class="loader-splash" *ngIf="adjusterService.loadInProcess || adjusterService.raiInProcess || adjusterService.clusteringInProcess">
   <div class="center-block">
-    <h1 [hidden]="!adjusterService.isLoading()">{{'ADJUSTER.loadingData' | translateHs: {app: 'default'} }}</h1>
-    <h1 [hidden]="!adjusterService.isCalculatingRAI()">{{'ADJUSTER.calcAttractivity' | translateHs: {app: 'default'} }}</h1>
-    <h1 [hidden]="!adjusterService.isClustering()">{{'ADJUSTER.calcClusters' | translateHs: {app: 'default'} }}</h1>
+    <h1 [hidden]="!adjusterService.loadInProcess">{{'ADJUSTER.loadingData' | translateHs: {app: 'default'} }}</h1>
+    <h1 [hidden]="!adjusterService.raiInProcess">{{'ADJUSTER.calcAttractivity' | translateHs: {app: 'default'} }}</h1>
+    <h1 [hidden]="!adjusterService.clusteringInProcess">{{'ADJUSTER.calcClusters' | translateHs: {app: 'default'} }}</h1>
     <div class="spinner-border spinner" role="status">
       <span class="visually-hidden">{{'ADJUSTER.loading' | translateHs: {app: 'default'} }}...</span>
     </div>

src/adjuster/adjuster-loader/adjuster-loader.component.ts

@@ -1,7 +1,6 @@
-import {AfterViewInit, Component, Input, ViewRef} from '@angular/core';
+import {Component, Input, OnInit, ViewRef} from '@angular/core';
 
-import {HsDialogComponent} from 'hslayers-ng';
-import {HsDialogContainerService} from 'hslayers-ng';
+import {HsDialogComponent, HsDialogContainerService} from 'hslayers-ng';
 
 import {AdjusterEventService} from '../adjuster-event.service';
 import {AdjusterService} from '../adjuster.service';
@@ -11,9 +10,7 @@ import {AdjusterService} from '../adjuster.service';
   templateUrl: './adjuster-loader.component.html',
   styleUrls: ['./adjuster-loader.component.scss'],
 })
-export class AdjusterLoaderComponent
-  implements HsDialogComponent, AfterViewInit
-{
+export class AdjusterLoaderComponent implements HsDialogComponent, OnInit {
   @Input() data;
   viewRef: ViewRef;
   constructor(
@@ -21,16 +18,18 @@ export class AdjusterLoaderComponent
     public adjusterService: AdjusterService,
     public adjusterEventService: AdjusterEventService
   ) {
-    console.log('dialog constucted');
+    // The next is necessary, otherwise the forkJoin() would hang up immediately
+    this.adjusterEventService.loaderReady.next();
+    this.adjusterEventService.loaderReady.complete();
     /*this.adjusterEventService.loaded.subscribe(() => {
       this.hsDialogContainerService.destroy(this);
     });*/
   }
 
-  ngAfterViewInit(): void {
-    console.log('dialog afterViewInit');
+  ngOnInit(): void {
+    /*console.log('dialog OnInit');
     // The next is necessary, otherwise the forkJoin() would hang up immediately
     this.adjusterEventService.loaderReady.next();
-    this.adjusterEventService.loaderReady.complete();
+    this.adjusterEventService.loaderReady.complete();*/
   }
 }

src/adjuster/adjuster-ui.service.ts

@@ -1,12 +1,7 @@
 import {Injectable} from '@angular/core';
 
-import {
-  HsDialogContainerService,
-  HsLayoutService,
-  HsPanelComponent,
-} from 'hslayers-ng';
+import {HsLayoutService} from 'hslayers-ng';
 
-import {AdjusterLoaderComponent} from './adjuster-loader/adjuster-loader.component';
 import {AdjusterPresetsService} from './adjuster-presets.service';
 import {AdjusterService} from './adjuster.service';
 
@@ -15,17 +10,8 @@ export class AdjusterUIService {
   constructor(
     public adjusterService: AdjusterService,
     public adjusterPresetsService: AdjusterPresetsService,
-    public hsDialogContainerService: HsDialogContainerService,
     public hsLayoutService: HsLayoutService
-  ) {
-    console.log('creating dialog...');
-    this.hsDialogContainerService.create(AdjusterLoaderComponent, {});
-    console.log(
-      '🚀 ~ file: adjuster-ui.service.ts ~ line 24 ~ hsDialogContainerService',
-      hsDialogContainerService
-    );
-    console.log('dialog creation done?');
-  }
+  ) {}
 
   hasDatasets(factor): boolean {
     return factor.datasets.length > 0;
@@ -35,10 +21,6 @@ export class AdjusterUIService {
     return this.adjusterPresetsService.getLabelInCurrentLang(labels);
   }
 
-  isVisible(): boolean {
-    return this.hsLayoutService.panelVisible('adjuster-advanced');
-  }
-
   noDataSelected(): boolean {
     if (this.adjusterService.factors.length === 0) {
       return true;

src/adjuster/adjuster.service.ts

@@ -33,17 +33,17 @@ export class AdjusterService {
   allowClusters = true;
   /** Used in the UI as a selector */
   allowIndex = false;
+  clusteringInProcess = false;
   factors: Array<Factor> = [];
   layersReady = new Set();
   //clusters = [];
+  /** Once instantiated, the load is definitely in process */
+  loadInProcess = true;
   //method: string;
   methods: Array<MethodDescription>;
   numberOfClusters: number;
-  private _clusteringInProcess: boolean;
+  raiInProcess = false;
   private _clustersLoaded: boolean;
-  /** Once instantiated, the load is definitely in process */
-  private _loadInProcess = true;
-  private _raiInProcess: boolean;
 
   constructor(
     public adjusterEventService: AdjusterEventService,
@@ -152,7 +152,7 @@ export class AdjusterService {
   }
 
   async calculateIndex(): Promise<void> {
-    this._raiInProcess = true;
+    this.raiInProcess = true;
     let attractivenessData: any;
     try {
       attractivenessData = await this.httpClient
@@ -175,7 +175,7 @@ export class AdjusterService {
       );
       console.warn(`Error obtaining data from ${this.serviceBaseUrl}.`);
       console.log(error);
-      this._raiInProcess = false;
+      this.raiInProcess = false;
       this.adjusterEventService.loaded.next({
         success: true,
         type: 'index',
@@ -208,7 +208,7 @@ export class AdjusterService {
       codeRecordRelations
     );
     console.timeEnd('forEach-Index');
-    this._raiInProcess = false;
+    this.raiInProcess = false;
     this.adjusterEventService.loaded.next({
       success: true,
       type: 'index',
@@ -216,7 +216,7 @@ export class AdjusterService {
   }
 
   async calculateClusters(): Promise<void> {
-    this._clusteringInProcess = true;
+    this.clusteringInProcess = true;
     /* Pre-process the API params */
     const params = [];
     for (const factor of this.factors) {
@@ -247,7 +247,7 @@ export class AdjusterService {
       );
       console.warn(`Error obtaining data from ${this.serviceBaseUrl}.`);
       console.log(error);
-      this._clusteringInProcess = false;
+      this.clusteringInProcess = false;
       this.adjusterEventService.loaded.next({
         success: false,
         type: 'clusters',
@@ -296,7 +296,7 @@ export class AdjusterService {
     //nuts.nuts3ClustersSource.legend_categories =
     //  this.adjusterLegendService.createClusterLegend(this.numberOfClusters);
     this._clustersLoaded = true;
-    this._clusteringInProcess = false;
+    this.clusteringInProcess = false;
     this.adjusterEventService.loaded.next({
       success: true,
       type: 'clusters',
@@ -327,9 +327,9 @@ export class AdjusterService {
       );
       console.warn(`Web service at ${this.serviceBaseUrl} unavailable!`);
       console.log(error);
-      this._loadInProcess = false;
+      this.loadInProcess = false;
     }
-    this._loadInProcess = false;
+    this.loadInProcess = false;
   }
 
   resetFactorWeights(factorId: string): number {
@@ -344,20 +344,6 @@ export class AdjusterService {
    * @returns {boolean} true if clustering or index processing is in process or loading data, false otherwise
    */
   isInProcess(): boolean {
-    return (
-      this._loadInProcess || this._clusteringInProcess || this._raiInProcess
-    );
-  }
-
-  isLoading(): boolean {
-    return this._loadInProcess;
-  }
-
-  isClustering(): boolean {
-    return this._clusteringInProcess;
-  }
-
-  isCalculatingRAI(): boolean {
-    return this._raiInProcess;
+    return this.loadInProcess || this.clusteringInProcess || this.raiInProcess;
   }
 }

src/app.component.ts

@@ -1,20 +1,29 @@
-import {Component} from '@angular/core';
+import {AfterViewInit, Component} from '@angular/core';
 
-import {AppConfig} from './app.config';
+import {HsDialogContainerService, HsLanguageService} from 'hslayers-ng';
+
+import {AdjusterLoaderComponent} from './adjuster/adjuster-loader/adjuster-loader.component';
 import {AppService} from './app.service';
-import {HsConfig, HsLanguageService} from 'hslayers-ng';
 
 @Component({
   selector: 'app-component',
   templateUrl: './app.component.html',
   styleUrls: ['./custom.scss'],
 })
-export class AppComponent {
+export class AppComponent implements AfterViewInit {
   constructor(
     public appService: AppService,
     //public hsConfig: HsConfig,
-    public hsLangService: HsLanguageService
+    public hsLangService: HsLanguageService,
+    public hsDialogContainerService: HsDialogContainerService
   ) {
     //this.hsConfig.update(AppConfig);
   }
+
+  ngAfterViewInit(): void {
+    // timeout due to https://angular.io/errors/NG0100
+    setTimeout(() => {
+      this.hsDialogContainerService.create(AdjusterLoaderComponent, {});
+    }, 0);
+  }
 }