From mboxrd@z Thu Jan 1 00:00:00 1970 Return-Path: Received: from firstgate.proxmox.com (firstgate.proxmox.com [212.224.123.68]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by lists.proxmox.com (Postfix) with ESMTPS id 5457F61FC8 for ; Fri, 23 Oct 2020 16:29:57 +0200 (CEST) Received: from firstgate.proxmox.com (localhost [127.0.0.1]) by firstgate.proxmox.com (Proxmox) with ESMTP id 52A6B28EF9 for ; Fri, 23 Oct 2020 16:29:57 +0200 (CEST) Received: from proxmox-new.maurer-it.com (proxmox-new.maurer-it.com [212.186.127.180]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by firstgate.proxmox.com (Proxmox) with ESMTPS id B6F7828ED5 for ; Fri, 23 Oct 2020 16:29:55 +0200 (CEST) Received: from proxmox-new.maurer-it.com (localhost.localdomain [127.0.0.1]) by proxmox-new.maurer-it.com (Proxmox) with ESMTP id 83A2345E96 for ; Fri, 23 Oct 2020 16:29:55 +0200 (CEST) From: Dominik Csapak To: pbs-devel@lists.proxmox.com Date: Fri, 23 Oct 2020 16:29:52 +0200 Message-Id: <20201023142954.27794-2-d.csapak@proxmox.com> X-Mailer: git-send-email 2.20.1 In-Reply-To: <20201023142954.27794-1-d.csapak@proxmox.com> References: <20201023142954.27794-1-d.csapak@proxmox.com> MIME-Version: 1.0 Content-Transfer-Encoding: 8bit X-SPAM-LEVEL: Spam detection results: 0 AWL 0.470 Adjusted score from AWL reputation of From: address KAM_DMARC_STATUS 0.01 Test Rule for DKIM or SPF Failure with Strict Alignment RCVD_IN_DNSWL_MED -2.3 Sender listed at https://www.dnswl.org/, medium trust SPF_HELO_NONE 0.001 SPF: HELO does not publish an SPF Record SPF_PASS -0.001 SPF: sender matches SPF record Subject: [pbs-devel] [PATCH widget-toolkit 1/3] add info widget from pve X-BeenThere: pbs-devel@lists.proxmox.com X-Mailman-Version: 2.1.29 Precedence: list List-Id: Proxmox Backup Server development discussion List-Unsubscribe: , List-Archive: List-Post: List-Help: List-Subscribe: , X-List-Received-Date: Fri, 23 Oct 2020 14:29:57 -0000 we want to reuse that, so copy it here and rename it to pmxInfoWidget Signed-off-by: Dominik Csapak --- src/Makefile | 1 + src/css/ext6-pmx.css | 17 ++++++++ src/panel/InfoWidget.js | 96 +++++++++++++++++++++++++++++++++++++++++ 3 files changed, 114 insertions(+) create mode 100644 src/panel/InfoWidget.js diff --git a/src/Makefile b/src/Makefile index ea71647..cd0bf26 100644 --- a/src/Makefile +++ b/src/Makefile @@ -37,6 +37,7 @@ JSSRC= \ grid/PendingObjectGrid.js \ grid/DiskList.js \ panel/InputPanel.js \ + panel/InfoWidget.js \ panel/LogView.js \ panel/JournalView.js \ panel/RRDChart.js \ diff --git a/src/css/ext6-pmx.css b/src/css/ext6-pmx.css index df5c73d..7011db3 100644 --- a/src/css/ext6-pmx.css +++ b/src/css/ext6-pmx.css @@ -52,3 +52,20 @@ left: 0.5em; top: 0.6em; } + +/* for info widget */ +div.left-aligned { + float: left; +} + +div.right-aligned { + float: right; +} + +.x-progress.critical .x-progress-bar{ + background-color: #FF8888; +} + +.x-progress.warning .x-progress-bar{ + background-color: #FFCC00; +} diff --git a/src/panel/InfoWidget.js b/src/panel/InfoWidget.js new file mode 100644 index 0000000..389968e --- /dev/null +++ b/src/panel/InfoWidget.js @@ -0,0 +1,96 @@ +Ext.define('Proxmox.widget.Info', { + extend: 'Ext.container.Container', + alias: 'widget.pmxInfoWidget', + + layout: { + type: 'vbox', + align: 'stretch' + }, + + value: 0, + maximum: 1, + printBar: true, + items: [ + { + xtype: 'component', + itemId: 'label', + data: { + title: '', + usage: '', + iconCls: undefined + }, + tpl: [ + '
', + '', + ' ', + '', + '{title}
 
{usage}
' + ] + }, + { + height: 2, + border: 0 + }, + { + xtype: 'progressbar', + itemId: 'progress', + height: 5, + value: 0, + animate: true + } + ], + + warningThreshold: 0.6, + criticalThreshold: 0.9, + + setPrintBar: function(enable) { + var me = this; + me.printBar = enable; + me.getComponent('progress').setVisible(enable); + }, + + setIconCls: function(iconCls) { + var me = this; + me.getComponent('label').data.iconCls = iconCls; + }, + + updateValue: function(text, usage) { + var me = this; + var label = me.getComponent('label'); + label.update(Ext.apply(label.data, {title: me.title, usage:text})); + + if (usage !== undefined && + me.printBar && + Ext.isNumeric(usage) && + usage >= 0) { + var progressBar = me.getComponent('progress'); + progressBar.updateProgress(usage, ''); + if (usage > me.criticalThreshold) { + progressBar.removeCls('warning'); + progressBar.addCls('critical'); + } else if (usage > me.warningThreshold) { + progressBar.removeCls('critical'); + progressBar.addCls('warning'); + } else { + progressBar.removeCls('warning'); + progressBar.removeCls('critical'); + } + } + }, + + initComponent: function() { + var me = this; + + if (!me.title) { + throw "no title defined"; + } + + me.callParent(); + + me.getComponent('progress').setVisible(me.printBar); + + me.updateValue(me.text, me.value); + me.setIconCls(me.iconCls); + } + +}); -- 2.20.1