[pve-devel] [PATCH manager 5/8] add guests panel

[Dominik Csapak]

this adds a guests panel which will show the running/stopped/etc. guests
in the cluster dashboard

to update this, we have to call updateValues with the data

we do this, because in the component above, we will collect the data
after a load event of the PVE.data.Resources store, to avoid going
through this (sometimes large) list more than once

Signed-off-by: Dominik Csapak <d.csapak at proxmox.com>
---
 www/manager6/Makefile     |   1 +
 www/manager6/dc/Guests.js | 113 ++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 114 insertions(+)
 create mode 100644 www/manager6/dc/Guests.js

diff --git a/www/manager6/Makefile b/www/manager6/Makefile
index d9ca435..62eccbe 100644
--- a/www/manager6/Makefile
+++ b/www/manager6/Makefile
@@ -189,6 +189,7 @@ JSSRC= 				                 	\
 	ha/Fencing.js					\
 	dc/Summary.js					\
 	dc/Health.js					\
+	dc/Guests.js					\
 	dc/OptionView.js				\
 	dc/StorageView.js				\
 	dc/UserEdit.js					\
diff --git a/www/manager6/dc/Guests.js b/www/manager6/dc/Guests.js
new file mode 100644
index 0000000..c0b8023
--- /dev/null
+++ b/www/manager6/dc/Guests.js
@@ -0,0 +1,113 @@
+Ext.define('PVE.dc.Guests', {
+    extend: 'Ext.panel.Panel',
+    alias: 'widget.pveDcGuests',
+
+
+    title: gettext('Guests'),
+    height: 200,
+    layout: 'column',
+    bodyPadding: '0 20 20 20',
+
+    defaults: {
+	columnWidth: 0.5,
+	xtype: 'box',
+	padding: '0 50 0 50',
+	style: {
+	    'text-align':'center'
+	}
+    },
+    items: [{
+	itemId: 'qemu',
+	data: {
+	    running: 0,
+	    paused: 0,
+	    stopped: 0,
+	    template: 0
+	},
+	tpl: [
+	    '<h3>' + gettext("Virtual Machines") + '</h3>',
+	    '<div class="left-aligned">',
+		'<i class="good fa fa-fw fa-play-circle"> </i>',
+		gettext('Running'),
+	    '</div>',
+	    '<div class="right-aligned">{running}</div>' + '<br />',
+	    '<tpl if="paused > 0">',
+		'<div class="left-aligned">',
+		    '<i class="warning fa fa-fw fa-pause-circle"> </i>',
+		    gettext('Paused'),
+		'</div>',
+		'<div class="right-aligned">{paused}</div>' + '<br />',
+	    '</tpl>',
+	    '<div class="left-aligned">',
+		'<i class="faded fa fa-fw fa-stop-circle"> </i>',
+		gettext('Stopped'),
+	    '</div>',
+	    '<div class="right-aligned">{stopped}</div>' + '<br />',
+	    '<tpl if="template > 0">',
+		'<div class="left-aligned">',
+		    '<i class="fa fa-fw fa-circle-o"> </i>',
+		    gettext('Templates'),
+		'</div>',
+		'<div class="right-aligned">{template}</div>',
+	    '</tpl>'
+	]
+    },{
+	itemId: 'lxc',
+	data: {
+	    running: 0,
+	    paused: 0,
+	    stopped: 0,
+	    template: 0
+	},
+	tpl: [
+	    '<h3>' + gettext("LXC Container") + '</h3>',
+	    '<div class="left-aligned">',
+		'<i class="good fa fa-fw fa-play-circle"> </i>',
+		gettext('Running'),
+	    '</div>',
+	    '<div class="right-aligned">{running}</div>' + '<br />',
+	    '<tpl if="paused > 0">',
+		'<div class="left-aligned">',
+		    '<i class="warning fa fa-fw fa-pause-circle"> </i>',
+		    gettext('Paused'),
+		'</div>',
+		'<div class="right-aligned">{paused}</div>' + '<br />',
+	    '</tpl>',
+	    '<div class="left-aligned">',
+		'<i class="faded fa fa-fw fa-stop-circle"> </i>',
+		gettext('Stopped'),
+	    '</div>',
+	    '<div class="right-aligned">{stopped}</div>' + '<br />',
+	    '<tpl if="template > 0">',
+		'<div class="left-aligned">',
+		    '<i class="fa fa-fw fa-circle-o"> </i>',
+		    gettext('Templates'),
+		'</div>',
+		'<div class="right-aligned">{template}</div>',
+	    '</tpl>'
+	]
+    },{
+	itemId: 'error',
+	data: {
+	    num: 0
+	},
+	columnWidth: 1,
+	padding: '10 250 0 250',
+	tpl: [
+	    '<tpl if="num > 0">',
+		'<div class="left-aligned">',
+		    '<i class="critical fa fa-fw fa-times-circle"> </i>',
+		    gettext('Error'),
+		'</div>',
+		'<div class="right-aligned">{num}</div>',
+	    '</tpl>'
+	]
+    }],
+
+    updateValues: function(qemu, lxc, error) {
+	var me = this;
+	me.getComponent('qemu').update(qemu);
+	me.getComponent('lxc').update(lxc);
+	me.getComponent('error').update({num: error});
+    }
+});
-- 
2.1.4