ui: vm: allow to add socket backed serial devices

We show and can remove serial devices but couldn't add new ones
through the WebUI.
Add a simple component to allow adding serial ports backed by a
socket, which can be especially useful now with xterm.js

Passing through serial devices from /dev isn't possible with this, as
it is normally a root only operation and not that often used.

Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>

www/manager6/Makefile

@@ -129,6 +129,7 @@ JSSRC= 				                 	\
 	qemu/Config.js					\
 	qemu/CreateWizard.js				\
 	qemu/USBEdit.js					\
+	qemu/SerialEdit.js					\
 	qemu/AgentIPView.js				\
 	qemu/CloudInit.js				\
 	qemu/CIDriveEdit.js				\

www/manager6/qemu/HardwareView.js

@@ -570,6 +570,19 @@ Ext.define('PVE.qemu.HardwareView', {
 				    win.show();
 				}
 			    },
+			    {
+				text: gettext('Serial Port'),
+				itemId: 'addserial',
+				iconCls: 'pve-itype-icon-serial',
+				disabled: !caps.vms['VM.Config.Options'],
+				handler: function() {
+				    var win = Ext.create('PVE.qemu.SerialEdit', {
+					url: '/api2/extjs/' + baseurl
+				    });
+				    win.on('destroy', reload);
+				    win.show();
+				}
+			    },
 			    {
 				text: gettext('CloudInit Drive'),
 				itemId: 'addci',

www/manager6/qemu/SerialEdit.js

@@ -0,0 +1,81 @@
+/*jslint confusion: true */
+Ext.define('PVE.qemu.SerialnputPanel', {
+    extend: 'Proxmox.panel.InputPanel',
+
+    autoComplete: false,
+
+    setVMConfig: function(vmconfig) {
+	var me = this, i;
+	me.vmconfig = vmconfig;
+
+	for (i = 0; i < 4; i++) {
+	    var port = 'serial' +  i.toString();
+	    if (!me.vmconfig[port]) {
+		me.down('field[name=serialid]').setValue(i);
+		break;
+	    }
+	}
+
+    },
+
+    onGetValues: function(values) {
+	var me = this;
+
+	var id = 'serial' + values.serialid;
+	delete values.serialid;
+	values[id] = 'socket';
+	return values;
+    },
+
+    items: [
+	{
+	    xtype: 'proxmoxintegerfield',
+	    name: 'serialid',
+	    fieldLabel: gettext('Serial Port'),
+	    minValue: 0,
+	    maxValue: 3,
+	    allowBlank: false,
+	    validator: function(id) {
+		if (!this.rendered) {
+		    return true;
+		}
+		var me = this.up('panel');
+		if (me.vmconfig !== undefined && Ext.isDefined(me.vmconfig['serial' + id])) {
+			return "This device is already in use.";
+		}
+		return true;
+	    }
+	}
+    ]
+});
+
+Ext.define('PVE.qemu.SerialEdit', {
+    extend: 'Proxmox.window.Edit',
+
+    vmconfig: undefined,
+
+    isAdd: true,
+
+    subject: gettext('Serial Port'),
+
+    initComponent : function() {
+	var me = this;
+
+	// for now create of (socket) serial port only
+	me.isCreate = true;
+
+	var ipanel = Ext.create('PVE.qemu.SerialnputPanel', {});
+
+	Ext.apply(me, {
+	    items: [ ipanel ]
+	});
+
+	me.callParent();
+
+	me.load({
+	    success: function(response, options) {
+		ipanel.setVMConfig(response.result.data);
+	    }
+	});
+    }
+});