Add "Add remove logo button"

from @BenediktMehl
MaibornWolff · Jun 10, 2024 · 273f87c · 273f87c
1 parent 47e85f9
commit 273f87c
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 1 deletion.
diff --git 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/...on/app/codeCharta/ui/export3DMapButton/export3DMapDialog/export3DMapDialog.component.html b/...on/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/...tion/app/codeCharta/ui/export3DMapButton/export3DMapDialog/export3DMapDialog.component.ts b/...tion/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)