add RRD graphics to server status panel

diff --git a/js/ServerStatus.js b/js/ServerStatus.js
index a5928af91062cfccb972d81c1d9a567b61427af4..41e8897bebb125030812ce4dee37d5a33e9d7792 100644 (file)
--- a/js/ServerStatus.js
+++ b/js/ServerStatus.js
@@ -6,14 +6,111 @@ Ext.define('PMG.ServerStatus', {
 
     border: false,
 
+    scrollable: true,
+
+    bodyPadding: '0 0 10 0',
+    defaults: {
+       collapsible: true,
+       animCollapse: false,
+       margin: '10 10 0 10'
+    },
+
     tbar: [
        {
            text: gettext("Console"),
            handler: function() {
                PMG.Utils.openVNCViewer('shell', Proxmox.NodeName);
            }
+       },
+       '->',
+       {
+           xtype: 'proxmoxRRDTypeSelector'
        }
-    ]
+    ],
 
+    initComponent: function() {
+        var me = this;
+
+       var nodename = Proxmox.NodeName;
+       var rrdstore = Ext.create('Proxmox.data.RRDStore', {
+           rrdurl: "/api2/json/nodes/" + nodename + "/rrddata",
+           fields: [
+               { type: 'number', name: 'loadavg' },
+               { type: 'number', name: 'maxcpu' },
+               { type: 'number', name: 'cpu' },
+               { type: 'number', name: 'iowait' },
+               { type: 'number', name: 'memtotal' },
+               { type: 'number', name: 'memused' },
+               { type: 'number', name: 'swaptotal' },
+               { type: 'number', name: 'swapused' },
+               { type: 'number', name: 'roottotal' },
+               { type: 'number', name: 'rootused' },
+               { type: 'number', name: 'netin' },
+               { type: 'number', name: 'netout' },
+               { type: 'date', dateFormat: 'timestamp', name: 'time' }
+           ]
+       });
+
+       Ext.apply(me, {
+           items: [
+               {
+                   xtype: 'proxmoxRRDChart',
+                   title: gettext('CPU usage'),
+                   unit: 'percent',
+                   fields: ['cpu','iowait'],
+                   fieldTitles: [gettext('CPU usage'), gettext('IO delay')],
+                   store: rrdstore
+               },
+               {
+                   xtype: 'proxmoxRRDChart',
+                   title: gettext('Server load'),
+                   fields: ['loadavg'],
+                   fieldTitles: [gettext('Load average')],
+                   store: rrdstore
+               },
+               {
+                   xtype: 'proxmoxRRDChart',
+                   title: gettext('Memory usage'),
+                   unit: 'bytes',
+                   fields: ['memtotal','memused'],
+                   fieldTitles: [gettext('Total'), gettext('Used')],
+                   store: rrdstore
+               },
+               {
+                   xtype: 'proxmoxRRDChart',
+                   title: gettext('Swap usage'),
+                   unit: 'bytes',
+                   fields: ['swaptotal','swapused'],
+                   fieldTitles: [gettext('Total'), gettext('Used')],
+                   store: rrdstore
+               },
+               {
+                   xtype: 'proxmoxRRDChart',
+                   title: gettext('Network traffic'),
+                   unit: 'bytespersecond',
+                   fields: ['netin','netout'],
+                   fieldTitles: [gettext('Ingress'), gettext('Egress')],
+                   store: rrdstore
+               },
+               {
+                   xtype: 'proxmoxRRDChart',
+                   title: gettext('Disk usage'),
+                   unit: 'bytes',
+                   fields: ['roottotal','rootused'],
+                   fieldTitles: [gettext('Total'), gettext('Used')],
+                   store: rrdstore
+               }
+           ],
+           listeners: {
+               activate: function() {
+                   rrdstore.startUpdate();
+               },
+               destroy: function() {
+                   rrdstore.stopUpdate();
+               }
+           }
+       });
+       me.callParent();
+   }
 });