ui: refactor iso-selector out of the cd input panel

and make it into a proper field.
it's intended to be used like a single field, otherwise exactly as before

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>

www/manager6/Makefile

@@ -88,6 +88,7 @@ JSSRC= 							\
 	form/TagEdit.js					\
 	form/MultiFileButton.js				\
 	form/TagFieldSet.js				\
+	form/IsoSelector.js				\
 	grid/BackupView.js				\
 	grid/FirewallAliases.js				\
 	grid/FirewallOptions.js				\

www/manager6/form/IsoSelector.js

@@ -0,0 +1,107 @@
+Ext.define('PVE.form.IsoSelector', {
+    extend: 'Ext.container.Container',
+    alias: 'widget.pveIsoSelector',
+    mixins: [
+	'Ext.form.field.Field',
+	'Proxmox.Mixin.CBind',
+    ],
+
+    nodename: undefined,
+    insideWizard: false,
+
+    cbindData: function() {
+	let me = this;
+	return {
+	    nodename: me.nodename,
+	    insideWizard: me.insideWizard,
+	};
+    },
+
+    getValue: function() {
+	return this.lookup('file').getValue();
+    },
+
+    setValue: function(value) {
+	let me = this;
+	if (!value) {
+	    me.lookup('file').reset();
+	    return;
+	}
+	var match = value.match(/^([^:]+):/);
+	if (match) {
+	    me.lookup('storage').setValue(match[1]);
+	    me.lookup('file').setValue(value);
+	}
+    },
+
+    getErrors: function() {
+	let me = this;
+	me.lookup('storage').validate();
+	let file = me.lookup('file');
+	file.validate();
+	let value = file.getValue();
+	if (!value || !value.length) {
+	    return [""]; // for validation
+	}
+	return [];
+    },
+
+    setNodename: function(nodename) {
+	let me = this;
+	me.lookup('storage').setNodename(nodename);
+	me.lookup('file').setStorage(undefined, nodename);
+    },
+
+    setDisabled: function(disabled) {
+	let me = this;
+	me.lookup('storage').setDisabled(disabled);
+	me.lookup('file').setDisabled(disabled);
+	me.callParent();
+    },
+
+    referenceHolder: true,
+
+    items: [
+	{
+	    xtype: 'pveStorageSelector',
+	    reference: 'storage',
+	    isFormField: false,
+	    fieldLabel: gettext('Storage'),
+	    labelAlign: 'right',
+	    storageContent: 'iso',
+	    allowBlank: false,
+	    cbind: {
+		nodename: '{nodename}',
+		autoSelect: '{insideWizard}',
+		insideWizard: '{insideWizard}',
+		disabled: '{disabled}',
+	    },
+	    listeners: {
+		change: function(f, value) {
+		    let me = this;
+		    let selector = me.up('pveIsoSelector');
+		    selector.lookup('file').setStorage(value);
+		    selector.checkChange();
+		},
+	    },
+	},
+	{
+	    xtype: 'pveFileSelector',
+	    reference: 'file',
+	    isFormField: false,
+	    storageContent: 'iso',
+	    fieldLabel: gettext('ISO image'),
+	    labelAlign: 'right',
+	    cbind: {
+		nodename: '{nodename}',
+		disabled: '{disabled}',
+	    },
+	    allowBlank: false,
+	    listeners: {
+		change: function() {
+		    this.up('pveIsoSelector').checkChange();
+		},
+	    },
+	},
+    ],
+});

www/manager6/qemu/CDEdit.js

@@ -43,11 +43,7 @@ Ext.define('PVE.qemu.CDInputPanel', {
 	    values.mediaType = 'none';
 	} else {
 	    values.mediaType = 'iso';
-	    var match = drive.file.match(/^([^:]+):/);
-	    if (match) {
-		values.cdstorage = match[1];
-		values.cdimage = drive.file;
-	    }
+	    values.cdimage = drive.file;
 	}
 
 	me.drive = drive;
@@ -58,8 +54,7 @@ Ext.define('PVE.qemu.CDInputPanel', {
     setNodename: function(nodename) {
 	var me = this;
 
-	me.cdstoragesel.setNodename(nodename);
-	me.cdfilesel.setStorage(undefined, nodename);
+	me.isosel.setNodename(nodename);
     },
 
     initComponent: function() {
@@ -87,8 +82,7 @@ Ext.define('PVE.qemu.CDInputPanel', {
 		    if (!me.rendered) {
 			return;
 		    }
-		    me.down('field[name=cdstorage]').setDisabled(!value);
-		    var cdImageField = me.down('field[name=cdimage]');
+		    var cdImageField = me.down('pveIsoSelector');
 		    cdImageField.setDisabled(!value);
 		    if (value) {
 			cdImageField.validate();
@@ -99,32 +93,14 @@ Ext.define('PVE.qemu.CDInputPanel', {
 	    },
 	});
 
-	me.cdfilesel = Ext.create('PVE.form.FileSelector', {
+
+	me.isosel = Ext.create('PVE.form.IsoSelector', {
+	    nodename: me.nodename,
+	    insideWizard: me.insideWizard,
 	    name: 'cdimage',
-	    nodename: me.nodename,
-	    storageContent: 'iso',
-	    fieldLabel: gettext('ISO image'),
-	    labelAlign: 'right',
-	    allowBlank: false,
 	});
 
-	me.cdstoragesel = Ext.create('PVE.form.StorageSelector', {
-	    name: 'cdstorage',
-	    nodename: me.nodename,
-	    fieldLabel: gettext('Storage'),
-	    labelAlign: 'right',
-	    storageContent: 'iso',
-	    allowBlank: false,
-	    autoSelect: me.insideWizard,
-	    listeners: {
-		change: function(f, value) {
-		    me.cdfilesel.setStorage(value);
-		},
-	    },
-	});
-
-	items.push(me.cdstoragesel);
-	items.push(me.cdfilesel);
+	items.push(me.isosel);
 
 	items.push({
 	    xtype: 'radiofield',