[pve-devel] [RFC manager 24/28] use GaugeWidget from widget toolkit
Thomas Lamprecht
t.lamprecht at proxmox.com
Mon Dec 11 16:26:13 CET 2017
Signed-off-by: Thomas Lamprecht <t.lamprecht at proxmox.com>
---
www/manager6/Makefile | 1 -
www/manager6/ceph/Status.js | 2 +-
www/manager6/dc/Summary.js | 2 +-
www/manager6/panel/GaugeWidget.js | 96 ---------------------------------------
4 files changed, 2 insertions(+), 99 deletions(-)
delete mode 100644 www/manager6/panel/GaugeWidget.js
diff --git a/www/manager6/Makefile b/www/manager6/Makefile
index e8dbdf86..ca204c9e 100644
--- a/www/manager6/Makefile
+++ b/www/manager6/Makefile
@@ -77,7 +77,6 @@ JSSRC= \
panel/InfoWidget.js \
panel/TemplateStatusView.js \
panel/InputPanel.js \
- panel/GaugeWidget.js \
panel/HealthWidget.js \
window/LoginWindow.js \
window/Wizard.js \
diff --git a/www/manager6/ceph/Status.js b/www/manager6/ceph/Status.js
index d83b1cdb..72b3fb49 100644
--- a/www/manager6/ceph/Status.js
+++ b/www/manager6/ceph/Status.js
@@ -121,7 +121,7 @@ Ext.define('PVE.node.CephStatus', {
items: [
{
flex: 1,
- xtype: 'pveGauge',
+ xtype: 'proxmoxGauge',
itemId: 'space',
title: gettext('Usage')
},
diff --git a/www/manager6/dc/Summary.js b/www/manager6/dc/Summary.js
index 310bd267..a1d71fca 100644
--- a/www/manager6/dc/Summary.js
+++ b/www/manager6/dc/Summary.js
@@ -29,7 +29,7 @@ Ext.define('PVE.dc.Summary', {
bodyPadding: '0 0 10 0',
layout: 'hbox',
defaults: {
- xtype: 'pveGauge',
+ xtype: 'proxmoxGauge',
flex: 1
},
items:[
diff --git a/www/manager6/panel/GaugeWidget.js b/www/manager6/panel/GaugeWidget.js
deleted file mode 100644
index 0d809720..00000000
--- a/www/manager6/panel/GaugeWidget.js
+++ /dev/null
@@ -1,96 +0,0 @@
-Ext.define('PVE.panel.GaugeWidget', {
- extend: 'Ext.panel.Panel',
- alias: 'widget.pveGauge',
-
- defaults: {
- style: {
- 'text-align':'center'
- }
- },
- items: [
- {
- xtype: 'box',
- itemId: 'title',
- data: {
- title: ''
- },
- tpl: '<h3>{title}</h3>'
- },
- {
- xtype: 'polar',
- height: 120,
- border: false,
- itemId: 'chart',
- series: [{
- type: 'gauge',
- value: 0,
- colors: ['#f5f5f5'],
- sectors: [0],
- donut: 90,
- needleLength: 100,
- totalAngle: Math.PI
- }],
- sprites: [{
- id: 'valueSprite',
- type: 'text',
- text: '',
- textAlign: 'center',
- textBaseline: 'bottom',
- x: 125,
- y: 110,
- fontSize: 30
- }]
- },
- {
- xtype: 'box',
- itemId: 'text'
- }
- ],
-
- header: false,
- border: false,
-
- warningThreshold: 0.6,
- criticalThreshold: 0.9,
- warningColor: '#fc0',
- criticalColor: '#FF6C59',
- defaultColor: '#c2ddf2',
- backgroundColor: '#f5f5f5',
-
- initialValue: 0,
-
-
- updateValue: function(value, text) {
- var me = this;
- var color = me.defaultColor;
-
- if (value >= me.criticalThreshold) {
- color = me.criticalColor;
- } else if (value >= me.warningThreshold) {
- color = me.warningColor;
- }
-
- me.chart.series[0].setColors([color, me.backgroundColor]);
- me.chart.series[0].setValue(value*100);
-
- me.valueSprite.setText(' '+(value*100).toFixed(0) + '%');
- me.valueSprite.setAttributes({x: me.chart.getWidth()/2, y:me.chart.getHeight()-20}, true);
-
- if (text !== undefined) {
- me.text.setHtml(text);
- }
- },
-
- initComponent: function() {
- var me = this;
-
- me.callParent();
-
- if (me.title) {
- me.getComponent('title').update({title: me.title});
- }
- me.text = me.getComponent('text');
- me.chart = me.getComponent('chart');
- me.valueSprite = me.chart.getSurface('chart').get('valueSprite');
- }
-});
--
2.11.0
More information about the pve-devel
mailing list