From 0f22f53b36676eb47a808ff4557c0c9ffa63aeac Mon Sep 17 00:00:00 2001
From: Dominik Csapak <d.csapak@proxmox.com>
Date: Thu, 1 Oct 2020 09:57:57 +0200
Subject: [PATCH] ui: RemoteEdit: remove port field and parse it from host
 field

use our hostport regexes to parse out a potential port from the host field
and send it individually

this makes for a simpler and cleaner ui

this additionally checks the field for valid input before sending it to
the backend

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 www/window/RemoteEdit.js | 58 ++++++++++++++++++++++++++++++++++------
 1 file changed, 50 insertions(+), 8 deletions(-)

diff --git a/www/window/RemoteEdit.js b/www/window/RemoteEdit.js
index 7d0ea546..bf5c11fc 100644
--- a/www/window/RemoteEdit.js
+++ b/www/window/RemoteEdit.js
@@ -45,18 +45,45 @@ Ext.define('PBS.window.RemoteEdit', {
 	    {
 		xtype: 'proxmoxtextfield',
 		allowBlank: false,
-		name: 'host',
+		name: 'hostport',
+		submitValue: false,
+		vtype: 'HostPort',
 		fieldLabel: gettext('Host'),
+		listeners: {
+		    change: function(field, newvalue) {
+			let host = newvalue;
+			let port;
+
+			let match = Proxmox.Utils.HostPort_match.exec(newvalue);
+			if (match === null) {
+			    match = Proxmox.Utils.HostPortBrackets_match.exec(newvalue);
+			    if (match === null) {
+				match = Proxmox.Utils.IP6_dotnotation_match.exec(newvalue);
+			    }
+			}
+
+			if (match !== null) {
+			    host = match[1];
+			    if (match[2] !== undefined) {
+				port = match[2];
+			    }
+			}
+
+			field.up('inputpanel').down('field[name=host]').setValue(host);
+			field.up('inputpanel').down('field[name=port]').setValue(port);
+		    }
+		}
 	    },
 	    {
-		xtype: 'proxmoxintegerfield',
-		allowBlank: true,
-		minValue: 1,
-		maxValue: 2**16,
-		name: 'port',
-		emptyText: 8007,
+		xtype: 'proxmoxtextfield',
+		hidden: true,
+		name: 'host',
+	    },
+	    {
+		xtype: 'proxmoxtextfield',
+		hidden: true,
 		deleteEmpty: true,
-		fieldLabel: gettext('Port'),
+		name: 'port',
 	    },
 	],
 
@@ -95,6 +122,21 @@ Ext.define('PBS.window.RemoteEdit', {
 	],
     },
 
+    setValues: function(values) {
+	let me = this;
+
+	let host = values.host;
+	if (values.port !== undefined) {
+	    if (Proxmox.Utils.IP6_match.test(host)) {
+		host = `[${host}]`;
+	    }
+	    host += `:${values.port}`;
+	}
+	values.hostport = host;
+
+	return me.callParent([values]);
+    },
+
     getValues: function() {
 	let me = this;
 	let values = me.callParent(arguments);