From 33a4fc355cc11e3d76e7e83dbfa74ae83775b33d Mon Sep 17 00:00:00 2001
From: Dominik Csapak <d.csapak@proxmox.com>
Date: Thu, 5 Apr 2018 16:03:44 +0200
Subject: [PATCH] add advanced options to the input panel

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@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.39.5