[pve-devel] [PATCH widget-toolkit 1/2] add advanced options to the input panel
Dominik Csapak
d.csapak at proxmox.com
Thu Apr 5 16:03:44 CEST 2018
with this, you can now put items in the
advancedColumn1/2/B and show/hide it with
setAdvancedVisible
Signed-off-by: Dominik Csapak <d.csapak at proxmox.com>
---
panel/InputPanel.js | 79 +++++++++++++++++++++++++++++++++++++++++++++++++++++
1 file changed, 79 insertions(+)
diff --git a/panel/InputPanel.js b/panel/InputPanel.js
index e3a2520..4bc5777 100644
--- a/panel/InputPanel.js
+++ b/panel/InputPanel.js
@@ -20,6 +20,13 @@ Ext.define('Proxmox.panel.InputPanel', {
// setting this will display a help button in our parent panel
onlineHelp: undefined,
+ // will be set if the inputpanel has advanced items
+ hasAdvanced: false,
+
+ // if the panel has advanced items,
+ // this will determine if they are shown by default
+ showAdvanced: false,
+
// overwrite this to modify submit data
onGetValues: function(values) {
return values;
@@ -43,6 +50,14 @@ Ext.define('Proxmox.panel.InputPanel', {
return me.onGetValues(values);
},
+ setAdvancedVisible: function(visible) {
+ var me = this;
+ var advItems = me.getComponent('advancedContainer');
+ if (advItems) {
+ advItems.setVisible(visible);
+ }
+ },
+
setValues: function(values) {
var me = this;
@@ -138,6 +153,70 @@ Ext.define('Proxmox.panel.InputPanel', {
throw "unsupported config";
}
+ var advItems;
+ if (me.advancedItems) {
+ advItems = [
+ {
+ columnWidth: 1,
+ layout: 'anchor',
+ items: me.advancedItems
+ }
+ ];
+ me.advancedItems = undefined;
+ } else if (me.advancedColumn1) {
+ advItems = [
+ {
+ columnWidth: 0.5,
+ padding: '0 10 0 0',
+ layout: 'anchor',
+ items: me.advancedColumn1
+ },
+ {
+ columnWidth: 0.5,
+ padding: '0 0 0 10',
+ layout: 'anchor',
+ items: me.advancedColumn2 || [] // allow empty column
+ }
+ ];
+
+ me.advancedColumn1 = undefined;
+ me.advancedColumn2 = undefined;
+
+ if (me.advancedColumnB) {
+ advItems.push({
+ columnWidth: 1,
+ padding: '10 0 0 0',
+ layout: 'anchor',
+ items: me.advancedColumnB
+ });
+ me.advancedColumnB = undefined;
+ }
+ }
+
+ if (advItems) {
+ me.hasAdvanced = true;
+ advItems.unshift({
+ columnWidth: 1,
+ xtype: 'box',
+ hidden: false,
+ border: true,
+ autoEl: {
+ tag: 'hr'
+ }
+ });
+ items.push({
+ columnWidth: 1,
+ xtype: 'container',
+ itemId: 'advancedContainer',
+ hidden: !me.showAdvanced,
+ layout: 'column',
+ defaults: {
+ border: false
+ },
+ items: advItems
+ });
+ }
+
if (me.useFieldContainer) {
Ext.apply(me, {
layout: 'fit',
--
2.11.0
More information about the pve-devel
mailing list