in general i'm not really happy with the manual insertion of a div here,
wouldn't it also be possible to extend the progressbar
and change the rendertemplate?
that way we could have a way nicer interface than
"get the dom element if it exists, and manually set the css classes"
further comments inline
On 1/25/23 12:29, Matthias Heiserer wrote:
Signed-off-by: Matthias Heiserer <[email protected]>
---
src/Makefile | 1 +
src/panel/NodeMemoryWidget.js | 28 ++++++++++++++++++++++++++++
src/panel/StatusView.js | 2 +-
3 files changed, 30 insertions(+), 1 deletion(-)
create mode 100644 src/panel/NodeMemoryWidget.js
diff --git a/src/Makefile b/src/Makefile
index 95da5aa..5a0213a 100644
--- a/src/Makefile
+++ b/src/Makefile
@@ -54,6 +54,7 @@ JSSRC= \
panel/EOLNotice.js \
panel/InputPanel.js \
panel/InfoWidget.js \
+ panel/NodeMemoryWidget.js \
panel/LogView.js \
panel/NodeInfoRepoStatus.js \
panel/JournalView.js \
diff --git a/src/panel/NodeMemoryWidget.js b/src/panel/NodeMemoryWidget.js
new file mode 100644
index 0000000..e54899e
--- /dev/null
+++ b/src/panel/NodeMemoryWidget.js
@@ -0,0 +1,28 @@
+Ext.define('Proxmox.widget.NodeMemory', {
+ extend: 'Proxmox.widget.Info',
+ alias: 'widget.pmxNodeMemoryWidget',
+
+ updateValue: function(text, usage, mem) {
+ let me = this;
+
+ let arcUse = me.el?.getById("arcsize")?.dom;
+ if (arcUse) {
+ usage = (mem.used - mem.arcsize) / mem.total;
here you have to check if arcsize is set, because if it's
not, the result here is 'NaN' which gets interpreted as width: 0%
+ arcUse.style["margin-right"] = `${(mem.free / mem.total) * 100}%`;
+ }
+ me.callParent([text, usage]);
+ },
+
+ initComponent: function() {
+ let me = this;
+ me.callParent();
+
+ me.down("#progress").on('boxready', (self) => {
+ self.bar.dom.insertAdjacentHTML("beforebegin",
+ `<div id='arcsize'
+ style='margin-right: 100%; background-color: #86424c;
width: auto;'
i know this was before the dark theme, but this should probably be a css
variable?
+ class='x-progress-bar'>
+ </div>`);
+ });
+ },
+});
diff --git a/src/panel/StatusView.js b/src/panel/StatusView.js
index e2e81e2..7258f36 100644
--- a/src/panel/StatusView.js
+++ b/src/panel/StatusView.js
@@ -72,7 +72,7 @@ Ext.define('Proxmox.panel.StatusView', {
if (Ext.isFunction(field.calculate)) {
calculate = field.calculate;
}
- field.updateValue(renderer.call(field, used, max), calculate(used,
max));
+ field.updateValue(renderer.call(field, used, max), calculate(used,
max), used);
}
},
_______________________________________________
pve-devel mailing list
[email protected]
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel
