[pve-devel] r5975 - in pve-manager/pve2: lib/PVE www/new www/new/data www/new/node www/new/panel

[svn-commits at proxmox.com]

Author: dietmar
Date: 2011-05-13 10:34:49 +0200 (Fri, 13 May 2011)
New Revision: 5975

Added:
   pve-manager/pve2/www/new/panel/RRDView.js
Modified:
   pve-manager/pve2/lib/PVE/REST.pm
   pve-manager/pve2/www/new/Makefile.am
   pve-manager/pve2/www/new/data/UpdateStore.js
   pve-manager/pve2/www/new/node/Config.js
Log:
impl. RRDView.js


Modified: pve-manager/pve2/lib/PVE/REST.pm
===================================================================
--- pve-manager/pve2/lib/PVE/REST.pm	2011-05-13 05:37:57 UTC (rev 5974)
+++ pve-manager/pve2/lib/PVE/REST.pm	2011-05-13 08:34:49 UTC (rev 5975)
@@ -235,7 +235,7 @@
 	$r->status_line("$code $message");
     }
 
-    $r->content_type ($ct);
+    $r->content_type($ct) if $ct;
     my $raw = $response->decoded_content;
 
     # note: do not use err_headers_out(), because mod_deflate has a bug,

Modified: pve-manager/pve2/www/new/Makefile.am
===================================================================
--- pve-manager/pve2/www/new/Makefile.am	2011-05-13 05:37:57 UTC (rev 5974)
+++ pve-manager/pve2/www/new/Makefile.am	2011-05-13 08:34:49 UTC (rev 5975)
@@ -22,6 +22,7 @@
 	form/FileSelector.js				\
 	form/StorageSelector.js				\
 	panel/StatusPanel.js				\
+	panel/RRDView.js				\
 	window/LoginWindow.js				\
 	window/Wizard.js				\
 	grid/ObjectGrid.js				\

Modified: pve-manager/pve2/www/new/data/UpdateStore.js
===================================================================
--- pve-manager/pve2/www/new/data/UpdateStore.js	2011-05-13 05:37:57 UTC (rev 5974)
+++ pve-manager/pve2/www/new/data/UpdateStore.js	2011-05-13 08:34:49 UTC (rev 5975)
@@ -1,6 +1,10 @@
 Ext.define('PVE.data.UpdateStore', {
     extend: 'Ext.data.Store',
-    requires: ['PVE.Utils', 'Ext.util.*', 'PVE.data.UpdateQueue'],
+    requires: [
+	'PVE.Utils', 
+	'Ext.util.*', 
+	'PVE.data.UpdateQueue'
+    ],
 
     constructor: function(config) {
 	var me = this;

Modified: pve-manager/pve2/www/new/node/Config.js
===================================================================
--- pve-manager/pve2/www/new/node/Config.js	2011-05-13 05:37:57 UTC (rev 5974)
+++ pve-manager/pve2/www/new/node/Config.js	2011-05-13 08:34:49 UTC (rev 5975)
@@ -91,16 +91,13 @@
 		}
 	    });
 	};
+
+	var rrdurl = "/api2/png/nodes/" + nodename + "/rrd";
   
 	Ext.apply(me, {
 	    layout: {
 		type: 'table',
-		colums: 1,
-		tableAttrs: {
-		    style: {
-			width: '100%'
-		    }
-		}
+		columns: 1
 	    },
 	    autoScroll: true,
 	    bodyStyle: 'padding:10px',
@@ -158,7 +155,32 @@
 		{
 		    title: 'Status',
 		    xtype: 'pveNodeStatusView',
+		    width: 800,
 		    nodename: nodename
+		},
+		{
+		    xtype: 'pveRRDView',
+		    title: "CPU usage %",
+		    datasource: 'cpu,iowait',
+		    rrdurl: rrdurl
+		},
+		{
+		    xtype: 'pveRRDView',
+		    title: "Server load",
+		    datasource: 'loadavg',
+		    rrdurl: rrdurl
+		},
+		{
+		    xtype: 'pveRRDView',
+		    title: "Memory usage",
+		    datasource: 'memtotal,memused',
+		    rrdurl: rrdurl
+		},
+		{
+		    xtype: 'pveRRDView',
+		    title: "Network traffic",
+		    datasource: 'netin,netout',
+		    rrdurl: rrdurl
 		}
 	    ]
 	});

Added: pve-manager/pve2/www/new/panel/RRDView.js
===================================================================
--- pve-manager/pve2/www/new/panel/RRDView.js	                        (rev 0)
+++ pve-manager/pve2/www/new/panel/RRDView.js	2011-05-13 08:34:49 UTC (rev 5975)
@@ -0,0 +1,89 @@
+Ext.define('PVE.panel.RRDView', {
+    extend: 'Ext.panel.Panel',
+    alias: 'widget.pveRRDView',
+
+    initComponent : function() {
+	var me = this;
+
+	if (!me.timeframe) 
+	    me.timeframe = 'hour';
+	if (!me.rrdcffn)
+	    me.rrdcffn = 'AVERAGE';
+
+	if (!me.datasource) 
+	    throw "no datasource specified";
+
+	if (!me.rrdurl) 
+	    throw "no rrdurl specified";
+
+	var datasource = me.datasource;
+
+	// fixme: dcindex??
+	var dcindex = 0;
+	var create_url = function() {
+	    var url = me.rrdurl + "?ds=" + datasource + 
+		"&timeframe=" + me.timeframe + "&cf=" + me.rrdcffn +
+		"&_dc=" + dcindex;
+	    dcindex++;
+	    return url;
+	}
+
+	var stateid = 'pveRRDTypeSelection';
+
+	Ext.apply(me, {
+	    layout: 'fit',
+	    html: {
+		tag: 'img',
+		width: 800,
+		height: 200,
+		src:  create_url()
+	    },
+	    applyState : function(state) {
+		if (state && state.id) {
+		    me.timeframe = state.timeframe;
+		    me.rrdcffn = state.cf;
+		    me.reload_task.delay(10);
+		}
+	    }
+	});
+	
+	me.callParent();
+   
+	me.reload_task = new Ext.util.DelayedTask(function() {
+	    if (me.rendered) {
+		try {
+		    var html = {
+			tag: 'img',
+			width: 800,
+			height: 200,
+			src:  create_url()
+		    };
+		    me.update(html);
+		} catch (e) {
+		    // fixme:
+		    console.log(e);
+		}
+		me.reload_task.delay(30000);
+	    } else {
+		me.reload_task.delay(1000);
+	    }
+	});
+
+	me.reload_task.delay(30000);
+
+	me.on('destroy', function() {
+	    me.reload_task.cancel();
+	});
+
+	var sp = Ext.state.Manager.getProvider();
+	me.applyState(sp.get(stateid));
+
+	var state_change_fn = function(prov, key, value) {
+	    if (key == stateid) {
+		me.applyState(value);
+	    }
+	};
+
+	me.mon(sp, 'statechange', state_change_fn);
+    }
+});