From 9f06dcab766d90d087f253e52b1333a6d494f390 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=B6ren=20Johanson?= <soeren@soeren.codes>
Date: Thu, 5 Sep 2024 07:13:17 +0200
Subject: [PATCH] Add back zoom buttons and shortcuts (#437)

---
 .../services/shortcuts/shortcuts.service.ts   | 14 +++++++
 .../floating-buttons.component.html           | 37 ++++++++++---------
 2 files changed, 34 insertions(+), 17 deletions(-)

diff --git a/teammapper-frontend/src/app/core/services/shortcuts/shortcuts.service.ts b/teammapper-frontend/src/app/core/services/shortcuts/shortcuts.service.ts
index 0e457d3e..9b6e4a31 100644
--- a/teammapper-frontend/src/app/core/services/shortcuts/shortcuts.service.ts
+++ b/teammapper-frontend/src/app/core/services/shortcuts/shortcuts.service.ts
@@ -113,6 +113,20 @@ export class ShortcutsService implements OnDestroy {
           this.mmpService.pasteNode();
         },
       },
+      {
+        keys: 'ctrl+=',
+        description: 'TOOLTIPS.ZOOM_IN_MAP',
+        callback: () => {
+          this.mmpService.zoomIn();
+        },
+      },
+      {
+        keys: 'ctrl+-',
+        description: 'TOOLTIPS.ZOOM_OUT_MAP',
+        callback: () => {
+          this.mmpService.zoomOut();
+        },
+      },
       {
         keys: 'left',
         description: 'TOOLTIPS.SELECT_NODE_ON_THE_LEFT',
diff --git a/teammapper-frontend/src/app/modules/application/components/floating-buttons/floating-buttons.component.html b/teammapper-frontend/src/app/modules/application/components/floating-buttons/floating-buttons.component.html
index cc38abff..c2566214 100644
--- a/teammapper-frontend/src/app/modules/application/components/floating-buttons/floating-buttons.component.html
+++ b/teammapper-frontend/src/app/modules/application/components/floating-buttons/floating-buttons.component.html
@@ -1,32 +1,35 @@
 <div class="floating-buttons">
   <div class="add-node no-touch">
-    <button
-      (click)="mmpService.addNode()"
-      [title]="'TOOLTIPS.ADD_NODE' | translate"
-      [disabled]="editDisabled"
-      class="mat-elevation-z2"
-      mat-mini-fab>
+    <button (click)="mmpService.addNode()" [title]="'TOOLTIPS.ADD_NODE' | translate" [disabled]="editDisabled"
+      class="mat-elevation-z2" mat-mini-fab>
       <mat-icon aria-label="Add node">add</mat-icon>
     </button>
   </div>
   <div class="remove-node no-touch">
-    <button
-      (click)="mmpService.removeNode()"
-      [title]="'TOOLTIPS.REMOVE_NODE' | translate"
-      [disabled]="editDisabled"
-      class="mat-elevation-z2"
-      mat-mini-fab>
+    <button (click)="mmpService.removeNode()" [title]="'TOOLTIPS.REMOVE_NODE' | translate" [disabled]="editDisabled"
+      class="mat-elevation-z2" mat-mini-fab>
       <mat-icon aria-label="Remove node">remove</mat-icon>
     </button>
   </div>
 
   <div class="center no-touch">
-    <button
-      (click)="mmpService.center()"
-      [title]="'TOOLTIPS.CENTER_MAP' | translate"
-      class="mat-elevation-z2"
+    <button (click)="mmpService.center()" [title]="'TOOLTIPS.CENTER_MAP' | translate" class="mat-elevation-z2"
       mat-mini-fab>
       <mat-icon aria-label="Center" color="primary">center_focus_weak</mat-icon>
     </button>
   </div>
-</div>
+
+  <div class="zoom-in no-touch">
+    <button (click)="mmpService.zoomIn()" [title]="'TOOLTIPS.ZOOM_IN_MAP' | translate" class="mat-elevation-z2"
+      mat-mini-fab>
+      <mat-icon aria-label="Zoom in" color="primary">zoom_in</mat-icon>
+    </button>
+  </div>
+
+  <div class="zoom-out no-touch">
+    <button (click)="mmpService.zoomOut()" [title]="'TOOLTIPS.ZOOM_OUT_MAP' | translate" class="mat-elevation-z2"
+      mat-mini-fab>
+      <mat-icon aria-label="Zoom out" color="primary">zoom_out</mat-icon>
+    </button>
+  </div>
+</div>
\ No newline at end of file