✨ introduce simple panel

src/adjuster/adjuster-advanced-panel.component.html

@@ -11,18 +11,28 @@
           <button type="button" class="btn btn-sm btn-light hs-lm-item-visibility"
             [ngClass]="adjusterService.allowIndex ? 'hs-checkmark' : 'hs-uncheckmark'"
             (click)="adjusterService.allowIndex = !adjusterService.allowIndex; $event.stopPropagation()"></button>
-          <label class="pl-2 text-secondary">{{'ADJUSTER.index' | translate}}</label>
+          <label class="pl-2 text-secondary" [ngClass]="adjusterService.allowIndex ? 'fw-bold' : 'fw-normal'">
+            {{'ADJUSTER.index' | translate}}
+          </label>
+          <p class="text-secondary text-justify">{{'ADJUSTER.indexDescription' | translate}}</p>
         </div>
         <div>
           <button type="button" class="btn btn-sm btn-light hs-lm-item-visibility"
             [ngClass]="adjusterService.allowClusters ? 'hs-checkmark' : 'hs-uncheckmark'"
             (click)="adjusterService.allowClusters = !adjusterService.allowClusters; $event.stopPropagation()"></button>
-            <label class="pl-2 text-secondary">{{'ADJUSTER.clusters' | translate}}</label>
+          <label class="pl-2 text-secondary" [ngClass]="adjusterService.allowClusters ? 'fw-bold' : 'fw-normal'">
+            {{'ADJUSTER.clusters' | translate}}
+          </label>
+          <p class="text-secondary text-justify">{{'ADJUSTER.clustersDescription' | translate}}</p>
         </div>
       </div>
       <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" [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">
+    </div>
     <div class="p-2 center-block">
       {{'ADJUSTER.myRoleIs' | translate}}:&emsp;
       <select class="form-select" [(ngModel)]="adjusterPresetsService.activeRole" (ngModelChange)="adjusterPresetsService.pickProblem($event)">
@@ -33,20 +43,23 @@
         <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">
+    <div class="pt-3 center-block">
+      <button type="button" class="btn btn-primary btn-sm" [disabled]="adjusterService.isInProcess()"
+        (click)="hsLayoutService.setMainPanel('adjuster-simple');$event.preventDefault();">
+        <span class="glyphicon cursor-pointer" class="icon-chevron-left"></span>
+        {{'ADJUSTER.simple' | translate}}
+      </button>
+    </div>
+    <!--button class="btn btn-light 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.moreOpts' | translate}}
+    </button-->
+    <div class="p-2 center-block">
       {{'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">
-    </div>
     <div *ngFor="let factor of adjusterService.factors">
       <pra-dataset-list [factor]="factor" *ngIf="hasDatasets(factor)"></pra-dataset-list>
     </div>

src/adjuster/adjuster-simple-panel.component.html

@@ -1,5 +1,5 @@
 <div [hidden]="!isVisible()" class="card mainpanel">
-  <hs-panel-header name="adjuster" [title]="'ADJUSTER.adjustFactors' | translate"></hs-panel-header>
+  <hs-panel-header name="adjuster" [title]="'ADJUSTER.adjustFactorsSimple' | translate"></hs-panel-header>
   <div class="card-body">
     <div class="p-2 center-block">
       <div class="d-flex flex-row">
@@ -7,22 +7,32 @@
           <button type="button" class="btn btn-primary btn-lg" (click)="adjusterService.apply()"
             [disabled]="adjusterService.isInProcess() || adjUIService.noDataSelected() || adjUIService.noOperationSelected() ">{{'ADJUSTER.calculate' | translate}}</button>
         </div>
-        <div>
+        <div class="exclusive">
           <button type="button" class="btn btn-sm btn-light hs-lm-item-visibility"
             [ngClass]="adjusterService.allowIndex ? 'hs-checkmark' : 'hs-uncheckmark'"
-            (click)="adjusterService.allowIndex = !adjusterService.allowIndex; $event.stopPropagation()"></button>
-          <label class="pl-2 text-secondary">{{'ADJUSTER.index' | translate}}</label>
+            (click)="selectIndex()"></button>
+          <label class="pl-2 text-secondary" [ngClass]="adjusterService.allowIndex ? 'fw-bold' : 'fw-normal'">
+            {{'ADJUSTER.index' | translate}}
+          </label>
+          <p class="text-secondary text-justify">{{'ADJUSTER.indexDescription' | translate}}</p>
         </div>
-        <div>
+        <div class="exclusive">
           <button type="button" class="btn btn-sm btn-light hs-lm-item-visibility"
             [ngClass]="adjusterService.allowClusters ? 'hs-checkmark' : 'hs-uncheckmark'"
-            (click)="adjusterService.allowClusters = !adjusterService.allowClusters; $event.stopPropagation()"></button>
-            <label class="pl-2 text-secondary">{{'ADJUSTER.clusters' | translate}}</label>
+            (click)="selectClusters()"></button>
+          <label class="pl-2 text-secondary" [ngClass]="adjusterService.allowClusters ? 'fw-bold' : 'fw-normal'">
+            {{'ADJUSTER.clusters' | translate}}
+          </label>
+          <p class="text-secondary text-justify">{{'ADJUSTER.clustersDescription' | translate}}</p>
         </div>
       </div>
       <div class="text-warning pt-2" [hidden]="!adjUIService.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" [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">
+    </div>
     <div class="p-2 center-block">
       {{'ADJUSTER.myRoleIs' | translate}}:&emsp;
       <select class="form-select" [(ngModel)]="adjusterPresetsService.activeRole" (ngModelChange)="adjusterPresetsService.pickProblem($event)">
@@ -33,40 +43,14 @@
         <option *ngFor="let problem of adjusterPresetsService.getActiveRoleProblems()" [ngValue]="problem">{{adjUIService.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">{{adjUIService.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">
-    </div>
-    <div *ngFor="let factor of adjusterService.factors">
-      <pra-dataset-list [factor]="factor" *ngIf="adjUIService.hasDatasets(factor)"></pra-dataset-list>
-    </div>
     <hr>
-    <!--form role="form" class="pt-3 form" [hidden]="!adjusterService.clustersLoaded()">
-      <div class="form-group">
-        <div class="input-group">
-          <label class="text-center">Display clusters calculated by method</label>
-          <div>
-            <select class="form-control" [(ngModel)]="method" (ngModelChange)="selectMethod()" name="method"
-              [value]="method">
-              <option *ngFor="let method of adjusterService.methods" [value]="method.codename">{{method.name}}
-              </option>
-            </select>
-          </div>
-        </div>
-        <small class="text-justify text-info">REMEMBER: Not all clustering methods will provide meaningful results. Always
-          take the output with a grain of salt.</small>
-      </div>
-    </form-->
+    <div class="pt-3 center-block">
+      <button type="button" class="btn btn-primary btn-sm" [disabled]="adjusterService.isInProcess()"
+        (click)="hsLayoutService.setMainPanel('adjuster-advanced');$event.preventDefault();">
+        <span class="glyphicon cursor-pointer" class="icon-chevron-right"></span>
+        {{'ADJUSTER.advanced' | translate}}
+      </button>
+    </div>
     <hr>
     <div class="pt-3 center-block" [hidden]="adjusterService.isInProcess()">
       {{'ADJUSTER.layerManagerLink1' | translate}}<br>

src/adjuster/adjuster-simple-panel.component.ts

@@ -17,7 +17,6 @@ export class AdjusterSimplePanelComponent implements HsPanelComponent {
   data: any;
   errorMsg: string;
   //method: string;
-  showAdvancedOptions = false;
   viewRef: ViewRef;
 
   constructor(
@@ -30,4 +29,16 @@ export class AdjusterSimplePanelComponent implements HsPanelComponent {
   isVisible(): boolean {
     return this.hsLayoutService.panelVisible('adjuster-simple');
   }
+
+  selectIndex() {
+    this.adjusterService.allowIndex = true;
+    this.adjusterService.allowClusters = false;
+    //TODO: disable/enable map layers
+  }
+
+  selectClusters() {
+    this.adjusterService.allowIndex = false;
+    this.adjusterService.allowClusters = true;
+    //TODO: disable/enable map layers
+  }
 }

src/adjuster/adjuster.service.ts

@@ -32,7 +32,7 @@ export class AdjusterService {
   /** Used in the UI as a selector */
   allowClusters = true;
   /** Used in the UI as a selector */
-  allowIndex = true;
+  allowIndex = false;
   factors: Array<Factor> = [];
   layersReady = new Set();
   //clusters = [];

src/app.service.ts

@@ -70,7 +70,7 @@ export class AppService {
       order: 0,
       title: () =>
         this.hsLanguageService.getTranslation('ADJUSTER.adjustFactors'),
-      description: 'Adjust factors for computation',
+      description: 'Attractiveness',
       icon: 'icon-analytics-piechart',
     });
     this.hsPanelContainerService.create(AdjusterSimplePanelComponent, {});
@@ -80,7 +80,7 @@ export class AppService {
       order: 0,
       title: () =>
         this.hsLanguageService.getTranslation('ADJUSTER.adjustFactors'),
-      description: 'Adjust factors for computation',
+      description: 'Play with attractiveness factors',
       icon: 'icon-analytics-piechart',
     });
     this.hsPanelContainerService.create(AdjusterAdvancedPanelComponent, {});
@@ -119,7 +119,7 @@ export class AppService {
   }
 
   init(): void {
-    this.hsLayoutService.setDefaultPanel('adjuster');
+    this.hsLayoutService.setDefaultPanel('adjuster-simple');
   }
 
   /**

src/translations.json

@@ -2,24 +2,29 @@
   "cs": {
     "ADJUSTER": {
       "adjustFactors": "Vyladit faktory",
+      "adjustFactorsSimple": "Atraktivita regionů",
       "advanced": "Pokročilé",
       "calculate": "Vypočítat",
       "calcAttractivity": "Počítám atraktivitu",
       "calcClusters": "Počítám shluky",
       "classifyBySchema": "Klasifikovat faktory dle schématu",
       "clusters": "Shluky",
+      "clustersDescription": "Skupiny podobných regionů",
       "index": "Index",
+      "indexDescription": "Žebříček atraktivity",
       "layerManagerLink1": "Vrstvy můžete prozkoumat",
       "layerManagerLink2": "ve",
       "layerManagerLinkLMName": "Správci vrstev",
       "loading": "Načítám",
       "loadingData": "Načítám data",
+      "moreOpts": "Více možností",
       "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"
+      "serverError": "Chyba serveru",
+      "simple": "Základní"
     },
     "METADATA": {
       "coverage": "Pokrývá území",
@@ -31,23 +36,28 @@
   "en": {
     "ADJUSTER": {
       "adjustFactors": "Adjust Factors",
+      "adjustFactorsSimple": "Regional Attractiveness",
       "advanced": "Advanced",
       "calculate": "Calculate",
       "calcAttractivity": "Calculating attractivity",
       "calcClusters": "Calculating clusters",
       "classifyBySchema": "Classify factors by schema",
       "clusters": "Clusters",
+      "clustersDescription": "Groups of similar regions",
       "index": "Index",
+      "indexDescription": "Ranking of attractivness",
       "layerManagerLink1": "You can investigate the layers",
       "layerManagerLink2": "in the",
       "layerManagerLinkLMName": "Layer Manager",
       "loading": "Loading",
       "loadingData": "Loading data",
+      "moreOpts": "More options",
       "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"
+      "serverError": "Server error",
+      "simple": "Basic"
     },
     "METADATA": {
       "coverage": "Covers area",