From b28f224fdd88b74b85d932e03cafbab598446bf7 Mon Sep 17 00:00:00 2001
From: piotrpekala7 <31202938+piotrpekala7@users.noreply.github.com>
Date: Thu, 13 Feb 2020 11:26:27 +0100
Subject: [PATCH] Getters in code instead of extended ngClass in HTML files

---
 .../project-map-menu.component.html            |  6 +++---
 .../project-map-menu.component.ts              | 18 ++++++++++++++++++
 2 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/src/app/components/project-map/project-map-menu/project-map-menu.component.html b/src/app/components/project-map/project-map-menu/project-map-menu.component.html
index c86e770d..3834d991 100644
--- a/src/app/components/project-map/project-map-menu/project-map-menu.component.html
+++ b/src/app/components/project-map/project-map-menu/project-map-menu.component.html
@@ -3,7 +3,7 @@
     mat-icon-button
     class="menu-button"
     (click)="addDrawing('text')">
-    <mat-icon [ngClass]="{unmarkedLight: !drawTools.isTextChosen && isLightThemeEnabled, marked: drawTools.isTextChosen}">create</mat-icon>
+    <mat-icon [ngClass]="getCssClassForIcon('text')">create</mat-icon>
 </button>
 <input
     type="file"
@@ -23,14 +23,14 @@
     mat-icon-button
     class="menu-button"
     (click)="addDrawing('rectangle')">
-    <mat-icon [ngClass]="{unmarkedLight: !drawTools.isRectangleChosen && isLightThemeEnabled, marked: drawTools.isRectangleChosen}">crop_3_2</mat-icon>
+    <mat-icon [ngClass]="getCssClassForIcon('rectangle')">crop_3_2</mat-icon>
 </button>
 <button
     matTooltip="Draw an ellipse"
     mat-icon-button
     class="menu-button"
     (click)="addDrawing('ellipse')">
-    <mat-icon [ngClass]="{unmarkedLight: !drawTools.isEllipseChosen && isLightThemeEnabled, marked: drawTools.isEllipseChosen}">panorama_fish_eye</mat-icon>
+    <mat-icon [ngClass]="getCssClassForIcon('ellipse')">panorama_fish_eye</mat-icon>
 </button>
 <button *ngIf="!isLightThemeEnabled"
     matTooltip="Draw a line" 
diff --git a/src/app/components/project-map/project-map-menu/project-map-menu.component.ts b/src/app/components/project-map/project-map-menu/project-map-menu.component.ts
index 86fcb6fb..df26b4cf 100644
--- a/src/app/components/project-map/project-map-menu/project-map-menu.component.ts
+++ b/src/app/components/project-map/project-map-menu/project-map-menu.component.ts
@@ -47,6 +47,24 @@ export class ProjectMapMenuComponent implements OnInit, OnDestroy {
         this.themeService.getActualTheme() === 'light' ? this.isLightThemeEnabled = true : this.isLightThemeEnabled = false; 
     }
 
+    getCssClassForIcon(type: string) {
+        if (type === 'text') {
+            return {
+                'unmarkedLight': !this.drawTools.isTextChosen && this.isLightThemeEnabled, 
+                'marked': this.drawTools.isTextChosen
+            };
+        } else if (type === 'rectangle') {
+            return {
+                'unmarkedLight': !this.drawTools.isRectangleChosen && this.isLightThemeEnabled, 
+                'marked': this.drawTools.isRectangleChosen
+            };
+        }
+        return {
+            'unmarkedLight': !this.drawTools.isEllipseChosen && this.isLightThemeEnabled, 
+            'marked': this.drawTools.isEllipseChosen
+        };
+    }
+
     public takeScreenshot() {
         const dialogRef = this.dialog.open(ScreenshotDialogComponent, {
             width: '400px',