[pbs-devel] [PATCH proxmox-backup] prune sim: make numberfields more similar to PBS's

[Fabian Ebner <f.ebner@proxmox.com>]

by creating a new class that adds a clear trigger and also uses the
clear-trigger image. Code was taken from the one in PBS's prune window,
but we have default values here, so a bit of adapting was necessary. For
example, we don't want to reset to the original value (which might have
been one of the defaults) when clearing, but always to 'null'.

Signed-off-by: Fabian Ebner <f.ebner@proxmox.com>
---
 docs/Makefile                           |   1 +
 docs/prune-simulator/clear-trigger.png  | Bin 0 -> 11118 bytes
 docs/prune-simulator/index.html         |   3 ++
 docs/prune-simulator/prune-simulator.js |  61 +++++++++++++-----------
 4 files changed, 38 insertions(+), 27 deletions(-)
 create mode 100644 docs/prune-simulator/clear-trigger.png

diff --git a/docs/Makefile b/docs/Makefile
index 0352c612..4c1d2b26 100644
--- a/docs/Makefile
+++ b/docs/Makefile
@@ -17,6 +17,7 @@ MANUAL_PAGES := 			\
 PRUNE_SIMULATOR_FILES := 					\
 	prune-simulator/index.html				\
 	prune-simulator/documentation.html			\
+	prune-simulator/clear-trigger.png			\
 	prune-simulator/prune-simulator.js
 
 # Sphinx documentation setup
diff --git a/docs/prune-simulator/clear-trigger.png b/docs/prune-simulator/clear-trigger.png
new file mode 100644
index 0000000000000000000000000000000000000000..cc374cf277060fbf6fee551c62927d4466609c80
GIT binary patch
literal 11118
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

literal 0
HcmV?d00001

diff --git a/docs/prune-simulator/index.html b/docs/prune-simulator/index.html
index 641ef435..861d560b 100644
--- a/docs/prune-simulator/index.html
+++ b/docs/prune-simulator/index.html
@@ -33,6 +33,9 @@
         .first-of-month {
             border-right: dashed black 4px;
         }
+        .clear-trigger {
+            background-image: url(./clear-trigger.png);
+        }
     </style>
 
     <script type="text/javascript" src="extjs/ext-all.js"></script>
diff --git a/docs/prune-simulator/prune-simulator.js b/docs/prune-simulator/prune-simulator.js
index 48c0a968..5533c2d6 100644
--- a/docs/prune-simulator/prune-simulator.js
+++ b/docs/prune-simulator/prune-simulator.js
@@ -265,6 +265,34 @@ Ext.onReady(function() {
 	},
     });
 
+    Ext.define('PBS.PruneSimulatorKeepInput', {
+	extend: 'Ext.form.field.Number',
+	alias: 'widget.prunesimulatorKeepInput',
+
+	allowBlank: true,
+	fieldGroup: 'keep',
+	minValue: 1,
+
+	listeners: {
+	    afterrender: function(field) {
+		this.triggers.clear.setVisible(field.value !== null);
+	    },
+	    change: function(field, newValue, oldValue) {
+		this.triggers.clear.setVisible(newValue !== null);
+	    },
+	},
+	triggers: {
+	    clear: {
+		cls: 'clear-trigger',
+		weight: -1,
+		handler: function() {
+		    this.triggers.clear.setVisible(false);
+		    this.setValue(null);
+		},
+	    },
+	},
+    });
+
     Ext.define('PBS.PruneSimulatorPanel', {
 	extend: 'Ext.panel.Panel',
 	alias: 'widget.prunesimulatorPanel',
@@ -560,58 +588,37 @@ Ext.onReady(function() {
 
 	keepItems: [
 	    {
-		xtype: 'numberfield',
+		xtype: 'prunesimulatorKeepInput',
 		name: 'keep-last',
-		allowBlank: true,
 		fieldLabel: 'keep-last',
-		minValue: 0,
 		value: 4,
-		fieldGroup: 'keep',
 	    },
 	    {
-		xtype: 'numberfield',
+		xtype: 'prunesimulatorKeepInput',
 		name: 'keep-hourly',
-		allowBlank: true,
 		fieldLabel: 'keep-hourly',
-		minValue: 0,
-		value: 0,
-		fieldGroup: 'keep',
 	    },
 	    {
-		xtype: 'numberfield',
+		xtype: 'prunesimulatorKeepInput',
 		name: 'keep-daily',
-		allowBlank: true,
 		fieldLabel: 'keep-daily',
-		minValue: 0,
 		value: 5,
-		fieldGroup: 'keep',
 	    },
 	    {
-		xtype: 'numberfield',
+		xtype: 'prunesimulatorKeepInput',
 		name: 'keep-weekly',
-		allowBlank: true,
 		fieldLabel: 'keep-weekly',
-		minValue: 0,
 		value: 2,
-		fieldGroup: 'keep',
 	    },
 	    {
-		xtype: 'numberfield',
+		xtype: 'prunesimulatorKeepInput',
 		name: 'keep-monthly',
-		allowBlank: true,
 		fieldLabel: 'keep-monthly',
-		minValue: 0,
-		value: 0,
-		fieldGroup: 'keep',
 	    },
 	    {
-		xtype: 'numberfield',
+		xtype: 'prunesimulatorKeepInput',
 		name: 'keep-yearly',
-		allowBlank: true,
 		fieldLabel: 'keep-yearly',
-		minValue: 0,
-		value: 0,
-		fieldGroup: 'keep',
 	    },
 	],
 
-- 
2.20.1