fix: add adjuster panel properly

src/adjuster/adjuster.component.ts

@@ -27,35 +27,10 @@ export class AdjusterComponent implements HsPanelComponent {
     //$scope.loading = false;
     //$scope.HsUtilsService = HsUtilsService;
     this.descriptionVisible = false;
-    this.init();
 
     //$scope.$emit('scope_loaded', 'adjuster');
   }
 
-  init(): void {
-    this.hsSidebarService.buttons.push(
-      {
-        panel: 'adjuster',
-        module: 'pra.adjuster',
-        order: 6,
-        title: 'Adjust factors',
-        description: 'Opens My Cool Panel',
-        icon: 'icon-analytics-piechart',
-      },
-      {
-        panel: 'hot',
-        module: 'my.hot',
-        order: 8,
-        title: 'My Hot Panel',
-        description: 'Opens My Hot Panel',
-        icon: 'icon-calcplus',
-      }
-    );
-    this.hsPanelContainerService.create(AdjusterComponent, {});
-    //this.hsPanelContainerService.create(MyHotComponent, {});
-    this.hsLayoutService.setDefaultPanel('adjuster');
-  }
-
   isVisible(): boolean {
     return this.hsLayoutService.panelVisible('adjuster');
   }

src/adjuster/adjuster.directive.html

@@ -2,11 +2,11 @@
   <hs-panel-header panel-name="adjuster" panel-title="'Adjust factors'"></hs-panel-header>
   <div class="card-body">
     <div class="p-2 center-block">
-      <button type="button" class="btn btn-primary" (click)="PraAdjusterService.apply()"
-        [disabled]="PraAdjusterService.isClusteringInProcess() || noDataSelected()">Calculate clusters</button>
+      <button type="button" class="btn btn-primary" (click)="adjusterService.apply()"
+        [disabled]="adjusterService.isClusteringInProcess() || noDataSelected()">Calculate clusters</button>
       <div class="text-warning pt-2" [hidden]="!noDataSelected()">Select at least one dataset and set at least one factor's weight to a non-zero value.</div>
     </div>
-    <div *ngFor="let factor of PraAdjusterService.factors">
+    <div *ngFor="let factor of adjusterService.factors">
       <div class="d-flex flex-row">
         <div class="p-2 flex-grow-1">
           <span class="glyphicon cursor-pointer"

src/adjuster/adjuster.module.ts

@@ -13,6 +13,7 @@ import {AdjusterService} from './adjuster.service';
   imports: [CommonModule, FormsModule, HsPanelHelpersModule, NgbModule],
   exports: [AdjusterComponent],
   declarations: [AdjusterComponent],
+  entryComponents: [AdjusterComponent],
   providers: [AdjusterService],
 })
 export class AdjusterModule {}

src/app-js.ts

@@ -21,10 +21,10 @@ import * as angular from 'angular';
 import View from 'ol/View';
 import {OSM} from 'ol/source';
 import {Tile} from 'ol/layer';
-//import {downgradeInjectable} from '@angular/upgrade/static';
+import {downgradeInjectable} from '@angular/upgrade/static';
 
 import {AppModule} from './app.module';
-//import {AppService} from './app.service';
+import {AppService} from './app.service';
 import {HsComponent, nuts2Layer, nuts3Layer} from './app.component';
 //import {downgrade} from 'hslayers-ng/common/downgrader';
 
@@ -117,5 +117,5 @@ export default angular
     },
     sizeMode: 'fullscreen',
   })
-  .component('hs', HsComponent);
-//.service('AppService', downgradeInjectable(AppService));
+  .component('hs', HsComponent)
+  .service('AppService', downgradeInjectable(AppService));

src/app.component.ts

@@ -18,7 +18,8 @@ export const HsComponent = {
     HsCore,
     HsLayoutService,
     HsSidebarService,
-    AdjusterService
+    AdjusterService,
+    AppService
   ) {
     'ngInject';
     const vm = this;

src/app.module.ts

@@ -16,7 +16,7 @@ import {BootstrapComponent} from 'hslayers-ng/bootstrap.component';
 import {HsCoreModule} from 'hslayers-ng/components/core/core.module';
 
 import {AdjusterModule} from './adjuster';
-//import {AppService} from './app.service';
+import {AppService} from './app.service';
 
 @NgModule({
   imports: [BrowserModule, UpgradeModule, HsCoreModule, AdjusterModule],
@@ -38,7 +38,7 @@ import {AdjusterModule} from './adjuster';
         };
       },
     },
-    //AppService,
+    AppService,
   ],
 })
 export class AppModule {

src/app.service.ts

@@ -5,8 +5,6 @@ import {HsPanelContainerService} from 'hslayers-ng/components/layout/panels/pane
 import {HsSidebarService} from 'hslayers-ng/components/sidebar/sidebar.service';
 
 import {AdjusterComponent} from './adjuster/adjuster.component';
-//import {MyCoolComponent} from './cool.component';
-//import {MyHotComponent} from './hot.component';
 
 @Injectable({providedIn: 'root'})
 export class AppService {
@@ -14,29 +12,20 @@ export class AppService {
     private hsLayoutService: HsLayoutService,
     private hsSidebarService: HsSidebarService,
     private hsPanelContainerService: HsPanelContainerService
-  ) {}
+  ) {
+    this.init();
+  }
 
   init(): void {
-    this.hsSidebarService.buttons.push(
-      {
-        panel: 'adjuster',
-        module: 'pra.adjuster',
-        order: 6,
-        title: 'Adjust factors',
-        description: 'Opens My Cool Panel',
-        icon: 'icon-analytics-piechart',
-      },
-      {
-        panel: 'hot',
-        module: 'my.hot',
-        order: 8,
-        title: 'My Hot Panel',
-        description: 'Opens My Hot Panel',
-        icon: 'icon-calcplus',
-      }
-    );
+    this.hsSidebarService.buttons.push({
+      panel: 'adjuster',
+      module: 'pra.adjuster',
+      order: 6,
+      title: 'Adjust factors',
+      description: 'Opens My Cool Panel',
+      icon: 'icon-analytics-piechart',
+    });
     this.hsPanelContainerService.create(AdjusterComponent, {});
-    //this.hsPanelContainerService.create(MyHotComponent, {});
     this.hsLayoutService.setDefaultPanel('adjuster');
   }
 }