add undo Zoom Button

this adds a decent undo zoom button, which is only enabled
when the chart is zoomed

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>

diff --git a/debian/changelog.Debian b/debian/changelog.Debian
index f3fa724cb988758f37a0fe1e57fd4d9833a2b78c..b960421b1146c87fd8f2c2ca2bcc04ab77bb9508 100644 (file)
--- a/debian/changelog.Debian
+++ b/debian/changelog.Debian
@@ -10,6 +10,8 @@ pve-manager (4.2-4) unstable; urgency=medium
 
   * Do not send -debug versions of framework files
 
+  * add undo Zoom Button
+
  -- Proxmox Support Team <support@proxmox.com>  Tue, 03 May 2016 06:33:55 +0200
 
 pve-manager (4.2-3) unstable; urgency=medium

diff --git a/www/manager6/panel/RRDChart.js b/www/manager6/panel/RRDChart.js
index 2b3db50272c74094b06782acf990e1c2bec69962..69998b05ac27ce408ad88bd32198f0cff5412368 100644 (file)
--- a/www/manager6/panel/RRDChart.js
+++ b/www/manager6/panel/RRDChart.js
@@ -5,7 +5,9 @@ Ext.define('PVE.widget.RRDChart', {
 
     width: 800,
     height: 300,
-    interactions: 'crosszoom',
+    interactions: [{
+       type: 'crosszoom'
+    }],
     axes: [{
        type: 'numeric',
        position: 'left',
@@ -24,7 +26,8 @@ Ext.define('PVE.widget.RRDChart', {
        width: 140
     },
     listeners: {
-       afterrender: 'onAfterRender'
+       afterrender: 'onAfterRender',
+       animationend: 'onAfterAnimation'
     },
 
     bytesArr : [
@@ -108,6 +111,18 @@ Ext.define('PVE.widget.RRDChart', {
        }
        me.axes[0].setTitle(axisTitle);
 
+
+       me.addTool({
+           type: 'minus',
+           disabled: true,
+           tooltip: gettext('Undo Zoom'),
+           handler: function(){
+               var undoButton = me.interactions[0].getUndoButton();
+               if (undoButton.handler) {
+                   undoButton.handler();
+               }
+           }
+       });
        // add a series for each field we get
        me.fields.forEach(function(item, index){
            var title = item;
@@ -144,6 +159,14 @@ Ext.define('PVE.widget.RRDChart', {
        });
     },
 
+    onAfterAnimation: function(chart, eopts) {
+       // if the undobuton is disabled,
+       // disable our tool
+       var ourUndoZoomButton = chart.tools[0];
+       var undoButton = chart.interactions[0].getUndoButton();
+       ourUndoZoomButton.setDisabled(undoButton.isDisabled());
+    },
+
     initComponent: function() {
        var me = this;