From 273f87c2d38ffff920fe945a7abd185a2624db27 Mon Sep 17 00:00:00 2001
From: Sebastian Wolf <65733509+phanlezz@users.noreply.github.com>
Date: Mon, 3 Jun 2024 14:56:28 +0200
Subject: [PATCH] Add "Add remove logo button"

from @BenediktMehl
---
 .../codeCharta/services/3DExports/preview3DPrintMesh.ts  | 4 ++++
 .../export3DMapDialog/export3DMapDialog.component.html   | 6 +++++-
 .../export3DMapDialog/export3DMapDialog.component.ts     | 9 +++++++++
 3 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/visualization/app/codeCharta/services/3DExports/preview3DPrintMesh.ts b/visualization/app/codeCharta/services/3DExports/preview3DPrintMesh.ts
index 4e2c370563..91cbf46662 100644
--- a/visualization/app/codeCharta/services/3DExports/preview3DPrintMesh.ts
+++ b/visualization/app/codeCharta/services/3DExports/preview3DPrintMesh.ts
@@ -222,6 +222,10 @@ export class Preview3DPrintMesh {
         this.customLogoMesh.rotateY(Math.PI) // Rotate 180 degrees
     }
 
+    removeCustomLogo() {
+        this.printMesh.remove(this.customLogoMesh)
+    }
+
     updateCustomLogoColor(newColor: string) {
         if (this.customLogoMesh.material instanceof MeshBasicMaterial) {
             this.customLogoMesh.material.color.set(newColor)
diff --git a/visualization/app/codeCharta/ui/export3DMapButton/export3DMapDialog/export3DMapDialog.component.html b/visualization/app/codeCharta/ui/export3DMapButton/export3DMapDialog/export3DMapDialog.component.html
index 898e05b7f6..a49678e799 100644
--- a/visualization/app/codeCharta/ui/export3DMapButton/export3DMapDialog/export3DMapDialog.component.html
+++ b/visualization/app/codeCharta/ui/export3DMapButton/export3DMapDialog/export3DMapDialog.component.html
@@ -43,7 +43,11 @@
     <mat-card appearance="outlined">
         <mat-card-header>Bottom left logo (SVG):</mat-card-header>
         <mat-card-content>
-            <input type="file" (change)="onFileSelected($event)" accept=".svg" />
+            <input #fileInput type="file" (change)="onFileSelected($event)" accept=".svg" />
+
+            <button (click)="onRemoveLogo()" [hidden]="!isFileSelected" mat-button title="Remove Logo Button">
+                <span><i class="fa fa-times"></i> Remove Logo</span>
+            </button>
 
             <div [hidden]="!isFileSelected">
                 <button (click)="onRotateLogo()" mat-button title="Rotate Logo Button">
diff --git a/visualization/app/codeCharta/ui/export3DMapButton/export3DMapDialog/export3DMapDialog.component.ts b/visualization/app/codeCharta/ui/export3DMapButton/export3DMapDialog/export3DMapDialog.component.ts
index f211b60a1a..ac9b0f75d4 100644
--- a/visualization/app/codeCharta/ui/export3DMapButton/export3DMapDialog/export3DMapDialog.component.ts
+++ b/visualization/app/codeCharta/ui/export3DMapButton/export3DMapDialog/export3DMapDialog.component.ts
@@ -35,6 +35,7 @@ interface Printer {
 })
 export class Export3DMapDialogComponent {
     @ViewChild("rendererContainer") rendererContainer: ElementRef
+    @ViewChild("fileInput") fileInput: ElementRef
     @Input() logoColor = "#ffffff"
 
     private printPreviewScene: Scene
@@ -122,6 +123,13 @@ export class Export3DMapDialogComponent {
     onFlipLogo() {
         this.previewMesh.flipCustomLogo()
     }
+
+    onRemoveLogo() {
+        this.isFileSelected = false
+        this.fileInput.nativeElement.value = ""
+        this.previewMesh.removeCustomLogo()
+    }
+
     onSelectedPrinterChange() {
         const wantedNumberOfColors = this.selectedPrinter.numberOfColors
         if (this.currentNumberOfColors !== wantedNumberOfColors) {
@@ -132,6 +140,7 @@ export class Export3DMapDialogComponent {
         this.makeMapMaxSize()
         this.updateCameraPosition(this.printPreviewScene.getObjectByName("camera") as PerspectiveCamera)
     }
+
     onLogoColorChange(newColor: string) {
         this.logoColor = newColor
         this.previewMesh.updateCustomLogoColor(this.logoColor)