prune sim: make numberfields more similar to PBS's

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>

diff --git a/docs/Makefile b/docs/Makefile
index 0352c612a8b52d627ebdca643d448f8529eaf304..4c1d2b26d44782518a0777e15c561485936757e2 100644 (file)
--- 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 (file)
index 0000000..cc374cf
Binary files /dev/null and b/docs/prune-simulator/clear-trigger.png differ

diff --git a/docs/prune-simulator/index.html b/docs/prune-simulator/index.html
index 641ef435b98f2ba2b9966085b51f08e599d66b6d..861d560b7d7d8de753aa225685abfa76164424b7 100644 (file)
--- 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 48c0a968f850663cd943f82513a63734676df5ba..5533c2d61f888441cbdda8fbb6748a069497e7f2 100644 (file)
--- 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',
            },
        ],