[pve-devel] [PATCH manager] ui: added cloud-init mtu and userdata options

[Marius Schellenberger <proxmox@giftfish.de>]

Added options to configure the cloud-init MTU and userdata fields
via the Web-UI.

Signed-off-by: Marius Schellenberger <proxmox@giftfish.de>
---
 www/manager6/Makefile             |  1 +
 www/manager6/Parser.js            |  6 ++
 www/manager6/Utils.js             |  8 +++
 www/manager6/qemu/CloudInit.js    | 10 ++++
 www/manager6/qemu/IPConfigEdit.js |  6 ++
 www/manager6/qemu/UserDataEdit.js | 94 +++++++++++++++++++++++++++++++
 6 files changed, 125 insertions(+)
 create mode 100644 www/manager6/qemu/UserDataEdit.js

diff --git a/www/manager6/Makefile b/www/manager6/Makefile
index ff452184..4453c637 100644
--- a/www/manager6/Makefile
+++ b/www/manager6/Makefile
@@ -152,6 +152,7 @@ JSSRC= 				                 	\
 	qemu/Config.js					\
 	qemu/CreateWizard.js				\
 	qemu/USBEdit.js					\
+	qemu/UserDataEdit.js				\
 	qemu/PCIEdit.js					\
 	qemu/SerialEdit.js				\
 	qemu/AgentIPView.js				\
diff --git a/www/manager6/Parser.js b/www/manager6/Parser.js
index b793a28e..580ed2ec 100644
--- a/www/manager6/Parser.js
+++ b/www/manager6/Parser.js
@@ -275,6 +275,8 @@ Ext.define('PVE.Parser', { statics: {
 		res.ip6 = match_res[1];
 	    } else if ((match_res = p.match(/^gw6=(\S+)$/)) !== null) {
 		res.gw6 = match_res[1];
+	    } else if ((match_res = p.match(/^mtu=(\S+)$/)) !== null) {
+		res.mtu = match_res[1];
 	    } else {
 		errors = true;
 		return false; // break
@@ -307,6 +309,10 @@ Ext.define('PVE.Parser', { statics: {
 	    str += c + "gw6=" + cfg.gw6;
 	    c = ",";
 	}
+	if (cfg.mtu) {
+	    str += c + "mtu=" + cfg.mtu;
+	    c = ",";
+	}
 	return str;
     },
 
diff --git a/www/manager6/Utils.js b/www/manager6/Utils.js
index 1dae292e..bd6aae4e 100644
--- a/www/manager6/Utils.js
+++ b/www/manager6/Utils.js
@@ -1260,6 +1260,14 @@ Ext.define('PVE.Utils', { utilities: {
 	reader.readAsText(file);
     },
 
+    loadUserDataFromFile: function(file, callback) {
+	var reader = new FileReader();
+	reader.onload = function(evt) {
+	    callback(evt.target.result);
+	};
+	reader.readAsText(file);
+    },
+
     diskControllerMaxIDs: {
 	ide: 4,
 	sata: 6,
diff --git a/www/manager6/qemu/CloudInit.js b/www/manager6/qemu/CloudInit.js
index a588f09b..ac960672 100644
--- a/www/manager6/qemu/CloudInit.js
+++ b/www/manager6/qemu/CloudInit.js
@@ -253,6 +253,16 @@ Ext.define('PVE.qemu.CloudInit', {
 		never_delete: true,
 		defaultValue: gettext('use host settings')
 	    },
+	    ciuserdata: {
+		header: 'User-Data',
+		iconCls: 'fa fa-code',
+		editor: caps.vms['VM.Config.Network'] ? 'PVE.qemu.UserDataEdit' : undefined,
+		never_delete: true,
+		defaultValue: '',
+		renderer: function(value) {
+		    return value || Proxmox.Utils.noneText;
+		}
+	    },
 	    sshkeys: {
 		header: gettext('SSH public key'),
 		iconCls: 'fa fa-key',
diff --git a/www/manager6/qemu/IPConfigEdit.js b/www/manager6/qemu/IPConfigEdit.js
index 934a86be..f1e2fc92 100644
--- a/www/manager6/qemu/IPConfigEdit.js
+++ b/www/manager6/qemu/IPConfigEdit.js
@@ -66,6 +66,12 @@ Ext.define('PVE.qemu.IPConfigPanel', {
 		fieldLabel: gettext('Network Device'),
 		value: me.netid
 	    },
+	    {
+		xtype: 'textfield',
+		name: 'mtu',
+		value: me.ipconfig.mtu,
+		fieldLabel: 'MTU'
+	    },
 	    {
 		layout: {
 		    type: 'hbox',
diff --git a/www/manager6/qemu/UserDataEdit.js b/www/manager6/qemu/UserDataEdit.js
new file mode 100644
index 00000000..465f5b8f
--- /dev/null
+++ b/www/manager6/qemu/UserDataEdit.js
@@ -0,0 +1,94 @@
+Ext.define('PVE.qemu.UserDataInputPanel', {
+    extend: 'Proxmox.panel.InputPanel',
+    xtype: 'pveQemuUserDataInputPanel',
+
+    insideWizard: false,
+
+    onGetValues: function(values) {
+	var me = this;
+	if (!values.ciuserdata.length) {
+	    values = {};
+	    values['delete'] = 'ciuserdata';
+	    return values;
+	} else {
+	    var fileheader = "#cloud-config"
+	    var data = values.ciuserdata.split('\n');
+	    if (data[0] != fileheader) {
+	        values.ciuserdata = fileheader + '\n' + values.ciuserdata;
+	    }
+	    values.ciuserdata = encodeURIComponent(btoa(values.ciuserdata));
+	}
+	return values;
+    },
+
+    items: [
+	{
+	    xtype: 'textarea',
+	    itemId: 'ciuserdata',
+	    name: 'ciuserdata',
+	    height: 250
+	},
+	{
+	    xtype: 'filebutton',
+	    itemId: 'filebutton',
+	    name: 'file',
+	    text: gettext('Load User-Data File'),
+	    fieldLabel: 'test',
+	    listeners: {
+		change: function(btn, e, value) {
+		    var me = this.up('inputpanel');
+		    e = e.event;
+		    Ext.Array.each(e.target.files, function(file) {
+			PVE.Utils.loadUserDataFromFile(file, function(res) {
+			    var dataField = me.down('#ciuserdata');
+			    var old = dataField.getValue();
+			    dataField.setValue(old + '\n' + res);
+			});
+		    });
+		    btn.reset();
+		}
+	    }
+	}
+    ],
+
+    initComponent: function() {
+	var me = this;
+
+	me.callParent();
+	if (!window.FileReader) {
+	    me.down('#filebutton').setVisible(false);
+	}
+
+    }
+});
+
+Ext.define('PVE.qemu.UserDataEdit', {
+    extend: 'Proxmox.window.Edit',
+
+    width: 800,
+
+    initComponent : function() {
+	var me = this;
+
+	var ipanel = Ext.create('PVE.qemu.UserDataInputPanel');
+
+	Ext.apply(me, {
+	    subject: 'User-Data',
+	    items: [ ipanel ]
+	});
+
+	me.callParent();
+
+	if (!me.create) {
+	    me.load({
+		success: function(response, options) {
+		    var data = response.result.data;
+		    if (data.ciuserdata) {
+			data.ciuserdata = atob(decodeURIComponent(data.ciuserdata));
+			ipanel.setValues(data);
+		    }
+		}
+	    });
+	}
+    }
+});
-- 
2.27.0