From 4ae3083e4104a4ec6397aad48dd28bbab6107153 Mon Sep 17 00:00:00 2001
From: jojohoch <joachim.hoch@iqb.hu-berlin.de>
Date: Fri, 25 Nov 2022 11:20:43 +0100
Subject: [PATCH] Allow optional undo and redo buttons for GeoGebra elements

---
 projects/common/components/geometry/geometry.component.ts  | 7 ++++---
 projects/common/models/elements/geometry/geometry.ts       | 2 ++
 .../element-model-properties.component.html                | 5 +++++
 projects/editor/src/assets/i18n/de.json                    | 1 +
 4 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/projects/common/components/geometry/geometry.component.ts b/projects/common/components/geometry/geometry.component.ts
index 569afb376..3288f376e 100644
--- a/projects/common/components/geometry/geometry.component.ts
+++ b/projects/common/components/geometry/geometry.component.ts
@@ -17,6 +17,7 @@ declare const GGBApplet: any;
       <div [id]="elementModel.id" class="geogebra-applet"></div>
       <button *ngIf="this.elementModel.showResetIcon"
               mat-icon-button
+              [style.top.px]="this.elementModel.showToolbar ? 50 : 0"
               class="reset-button"
               (click)="reset()">
         <mat-icon class="reset-icon">restart_alt</mat-icon>
@@ -28,7 +29,7 @@ declare const GGBApplet: any;
     ':host {display: block; width: 100%; height: 100%;}',
     '.geogebra-applet {margin: auto;}',
     '.geogebra-container {position: relative;}',
-    '.reset-button {position: absolute; top: 0; right: 0; z-index: 100; margin: 5px;}',
+    '.reset-button {position: absolute; right: 0; z-index: 100; margin: 5px;}',
     '.reset-icon {font-size: 30px !important;}'
   ]
 })
@@ -88,12 +89,12 @@ export class GeometryComponent extends ElementComponent implements AfterViewInit
       width: this.elementModel.width,
       height: this.elementModel.height,
       showToolBar: this.elementModel.showToolbar,
-      showResetIcon: false,
       enableShiftDragZoom: this.elementModel.enableShiftDragZoom,
       showZoomButtons: this.elementModel.showZoomButtons,
       showFullscreenButton: this.elementModel.showFullscreenButton,
       customToolBar: this.elementModel.customToolBar,
-      enableUndoRedo: false,
+      enableUndoRedo: this.elementModel.enableUndoRedo,
+      showResetIcon: false, // use custom html button icon
       showMenuBar: false,
       showAlgebraInput: false,
       enableLabelDrags: false,
diff --git a/projects/common/models/elements/geometry/geometry.ts b/projects/common/models/elements/geometry/geometry.ts
index ee941e725..2f9786e76 100644
--- a/projects/common/models/elements/geometry/geometry.ts
+++ b/projects/common/models/elements/geometry/geometry.ts
@@ -10,6 +10,7 @@ export class GeometryElement extends UIElement implements PositionedUIElement {
   width: number = 600;
   height: number = 400;
   showResetIcon: boolean = true;
+  enableUndoRedo: boolean = true;
   showToolbar: boolean = true;
   enableShiftDragZoom: boolean = true;
   showZoomButtons: boolean = true;
@@ -23,6 +24,7 @@ export class GeometryElement extends UIElement implements PositionedUIElement {
     this.width = element.width !== undefined ? element.width : 600;
     this.height = element.height !== undefined ? element.height : 400;
     this.showResetIcon = element.showResetIcon !== undefined ? element.showResetIcon : true;
+    this.enableUndoRedo = element.enableUndoRedo !== undefined ? element.enableUndoRedo : true;
     this.showToolbar = element.showToolbar !== undefined ? element.showToolbar : true;
     this.enableShiftDragZoom = element.enableShiftDragZoom !== undefined ? element.enableShiftDragZoom : true;
     this.showZoomButtons = element.showZoomButtons !== undefined ? element.showZoomButtons : true;
diff --git a/projects/editor/src/app/components/properties-panel/model-properties-tab/element-model-properties.component.html b/projects/editor/src/app/components/properties-panel/model-properties-tab/element-model-properties.component.html
index 5a1e7ea33..3b3c18914 100644
--- a/projects/editor/src/app/components/properties-panel/model-properties-tab/element-model-properties.component.html
+++ b/projects/editor/src/app/components/properties-panel/model-properties-tab/element-model-properties.component.html
@@ -171,6 +171,11 @@
                 (change)="updateModel.emit({ property: 'showResetIcon', value: $event.checked })">
     {{'propertiesPanel.showResetIcon' | translate }}
   </mat-checkbox>
+  <mat-checkbox *ngIf="combinedProperties.enableUndoRedo !== undefined"
+                [checked]="$any(combinedProperties.enableUndoRedo)"
+                (change)="updateModel.emit({ property: 'enableUndoRedo', value: $event.checked })">
+    {{'propertiesPanel.enableUndoRedo' | translate }}
+  </mat-checkbox>
   <mat-checkbox *ngIf="combinedProperties.showToolbar !== undefined"
                 [checked]="$any(combinedProperties.showToolbar)"
                 (change)="updateModel.emit({ property: 'showToolbar', value: $event.checked })">
diff --git a/projects/editor/src/assets/i18n/de.json b/projects/editor/src/assets/i18n/de.json
index f702ac364..7fd4aec89 100644
--- a/projects/editor/src/assets/i18n/de.json
+++ b/projects/editor/src/assets/i18n/de.json
@@ -177,6 +177,7 @@
     "hasBorderLeft": "Kante links",
     "hasBorderRight": "Kante rechts",
     "showResetIcon": "Zurücksetzen-Knopf anzeigen",
+    "enableUndoRedo": "Schritt rückgängig/wiederherstellen",
     "showToolbar": "Werkzeugleiste anzeigen",
     "showZoomButtons": "Zoom-Knöpfe anzeigen",
     "showFullscreenButton": "Vollbild-Knopf anzeigen",
-- 
GitLab