From mboxrd@z Thu Jan 1 00:00:00 1970 Return-Path: Received: from firstgate.proxmox.com (firstgate.proxmox.com [212.224.123.68]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by lists.proxmox.com (Postfix) with ESMTPS id 8BD826082F for ; Thu, 24 Sep 2020 16:11:59 +0200 (CEST) Received: from firstgate.proxmox.com (localhost [127.0.0.1]) by firstgate.proxmox.com (Proxmox) with ESMTP id 7FBFE12E04 for ; Thu, 24 Sep 2020 16:11:59 +0200 (CEST) Received: from proxmox-new.maurer-it.com (proxmox-new.maurer-it.com [212.186.127.180]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by firstgate.proxmox.com (Proxmox) with ESMTPS id 8C9A212DF2 for ; Thu, 24 Sep 2020 16:11:56 +0200 (CEST) Received: from proxmox-new.maurer-it.com (localhost.localdomain [127.0.0.1]) by proxmox-new.maurer-it.com (Proxmox) with ESMTP id 4DB2445512 for ; Thu, 24 Sep 2020 16:11:56 +0200 (CEST) From: Stefan Reiter To: pve-devel@lists.proxmox.com Date: Thu, 24 Sep 2020 16:11:42 +0200 Message-Id: <20200924141142.15842-2-s.reiter@proxmox.com> X-Mailer: git-send-email 2.20.1 In-Reply-To: <20200924141142.15842-1-s.reiter@proxmox.com> References: <20200924141142.15842-1-s.reiter@proxmox.com> MIME-Version: 1.0 Content-Transfer-Encoding: 8bit X-SPAM-LEVEL: Spam detection results: 0 AWL -0.053 Adjusted score from AWL reputation of From: address KAM_DMARC_STATUS 0.01 Test Rule for DKIM or SPF Failure with Strict Alignment RCVD_IN_DNSWL_MED -2.3 Sender listed at https://www.dnswl.org/, medium trust SPF_HELO_NONE 0.001 SPF: HELO does not publish an SPF Record SPF_PASS -0.001 SPF: sender matches SPF record URIBL_BLOCKED 0.001 ADMINISTRATOR NOTICE: The query to URIBL was blocked. See http://wiki.apache.org/spamassassin/DnsBlocklists#dnsbl-block for more information. [combobox.name, item.name, x.name, entry.name, me.store] Subject: [pve-devel] [PATCH manager 2/2] ui: improve boot order editor with 'bootorder' support X-BeenThere: pve-devel@lists.proxmox.com X-Mailman-Version: 2.1.29 Precedence: list List-Id: Proxmox VE development discussion List-Unsubscribe: , List-Archive: List-Post: List-Help: List-Subscribe: , X-List-Received-Date: Thu, 24 Sep 2020 14:11:59 -0000 The new 'bootorder' property can express many more scenarios than the old 'boot'/'bootdisk' ones. Update the editor so it can handle it. Features a grid with all supported boot devices which can be reordered using drag-and-drop, as well as toggled on and off with an inline checkbox. Support for configs still using the old properties is given, with the first write automatically updating the VM config to use the new one. The renderer for the Options panel is updated with support for the new format, and the display format for the fallback is changed to make it look uniform. Note that it is very well possible to disable all boot devices, in which case an empty 'bootorder: ' will be stored to the config file. I'm not sure what that would be useful for, but there's no reason to forbid it either, just warn the user that it's probably not what he wants. Signed-off-by: Stefan Reiter --- www/manager6/qemu/BootOrderEdit.js | 310 +++++++++++++++++------------ www/manager6/qemu/Options.js | 32 ++- 2 files changed, 210 insertions(+), 132 deletions(-) diff --git a/www/manager6/qemu/BootOrderEdit.js b/www/manager6/qemu/BootOrderEdit.js index 19d5d50a..b1236bbd 100644 --- a/www/manager6/qemu/BootOrderEdit.js +++ b/www/manager6/qemu/BootOrderEdit.js @@ -1,149 +1,208 @@ +Ext.define('pve-boot-order-entry', { + extend: 'Ext.data.Model', + fields: [ + {name: 'name', type: 'string'}, + {name: 'enabled', type: 'bool'}, + {name: 'desc', type: 'string'}, + ] +}); + Ext.define('PVE.qemu.BootOrderPanel', { extend: 'Proxmox.panel.InputPanel', alias: 'widget.pveQemuBootOrderPanel', + vmconfig: {}, // store loaded vm config + store: undefined, + originalValue: undefined, - bootdisk: undefined, - selection: [], - list: [], - comboboxes: [], - - isBootDisk: function(value) { + isDisk: function(value, cdrom) { return PVE.Utils.bus_match.test(value); }, - setVMConfig: function(vmconfig) { - var me = this; - me.vmconfig = vmconfig; - var order = me.vmconfig.boot || 'cdn'; - me.bootdisk = me.vmconfig.bootdisk || undefined; - - // get the first 3 characters - // ignore the rest (there should never be more than 3) - me.selection = order.split('').slice(0,3); - - // build bootdev list - me.list = []; - Ext.Object.each(me.vmconfig, function(key, value) { - if (me.isBootDisk(key) && - !(/media=cdrom/).test(value)) { - me.list.push([key, "Disk '" + key + "'"]); - } - }); - - me.list.push(['d', 'CD-ROM']); - me.list.push(['n', gettext('Network')]); - me.list.push(['__none__', Proxmox.Utils.noneText]); - - me.recomputeList(); - - me.comboboxes.forEach(function(box) { - box.resetOriginalValue(); - }); + isBootdev: function(dev, value) { + return this.isDisk(dev) || + (/^net\d+/).test(dev) || + (/^hostpci\d+/).test(dev) || + ((/^usb\d+/).test(dev) && !(/spice/).test(value)); }, - onGetValues: function(values) { - var me = this; - var order = me.selection.join(''); - var res = { boot: order }; + setVMConfig: function(vmconfig) { + let me = this; + me.vmconfig = vmconfig; - if (me.bootdisk && order.indexOf('c') !== -1) { - res.bootdisk = me.bootdisk; + me.store.removeAll(); + + let bootorder; + if (me.vmconfig.bootorder) { + bootorder = (/^\s*$/).test(me.vmconfig.bootorder) ? [] : + me.vmconfig.bootorder + .split(',') + .map(dev => ({name: dev, enabled: true})); } else { - res['delete'] = 'bootdisk'; + // legacy style, transform to new bootorder + let order = me.vmconfig.boot || 'cdn'; + let bootdisk = me.vmconfig.bootdisk || undefined; + + // get the first 3 characters + // ignore the rest (there should never be more than 3) + let orderList = order.split('').slice(0,3); + + // build bootdev list + bootorder = []; + for (let i = 0; i < orderList.length; i++) { + let list = []; + if (orderList[i] === 'c') { + if (bootdisk !== undefined && me.vmconfig[bootdisk]) { + list.push(bootdisk); + } + } else if (orderList[i] === 'd') { + Ext.Object.each(me.vmconfig, function(key, value) { + if (me.isDisk(key) && (/media=cdrom/).test(value)) { + list.push(key); + } + }); + } else if (orderList[i] === 'n') { + Ext.Object.each(me.vmconfig, function(key, value) { + if ((/^net\d+/).test(key)) { + list.push(key); + } + }); + } + + // Object.each iterates in random order, sort alphabetically + list.sort(); + list.forEach(dev => bootorder.push({name: dev, enabled: true})); + } } + // add disabled devices as well + let disabled = []; + Ext.Object.each(me.vmconfig, function(key, value) { + if (me.isBootdev(key, value) && + !Ext.Array.some(bootorder, x => x.name === key)) + { + disabled.push(key); + } + }); + disabled.sort(); + disabled.forEach(dev => bootorder.push({name: dev, enabled: false})); + + bootorder.forEach(entry => { + entry.desc = me.vmconfig[entry.name]; + }); + + me.store.insert(0, bootorder); + me.store.fireEvent("update"); + }, + + calculateValue: function() { + let me = this; + return me.store.getData().items + .filter(x => x.data.enabled) + .map(x => x.data.name) + .join(','); + }, + + onGetValues: function() { + let me = this; + // Note: we allow an empty value, so no 'delete' option + let res = { bootorder: me.calculateValue() }; return res; }, - recomputeSelection: function(combobox, newVal, oldVal) { - var me = this.up('#inputpanel'); - me.selection = []; - me.comboboxes.forEach(function(item) { - var val = item.getValue(); - - // when selecting an already selected item, - // switch it around - if ((val === newVal || (me.isBootDisk(val) && me.isBootDisk(newVal))) && - item.name !== combobox.name && - newVal !== '__none__') { - // swap items - val = oldVal; - } - - // push 'c','d' or 'n' in the array - if (me.isBootDisk(val)) { - me.selection.push('c'); - me.bootdisk = val; - } else if (val === 'd' || - val === 'n') { - me.selection.push(val); - } - }); - - me.recomputeList(); - }, - - recomputeList: function(){ - var me = this; - // set the correct values in the kvcomboboxes - var cnt = 0; - me.comboboxes.forEach(function(item) { - if (cnt === 0) { - // never show 'none' on first combobox - item.store.loadData(me.list.slice(0, me.list.length-1)); - } else { - item.store.loadData(me.list); - } - item.suspendEvent('change'); - if (cnt < me.selection.length) { - item.setValue((me.selection[cnt] !== 'c')?me.selection[cnt]:me.bootdisk); - } else if (cnt === 0){ - item.setValue(''); - } else { - item.setValue('__none__'); - } - cnt++; - item.resumeEvent('change'); - item.validate(); - }); - }, - initComponent : function() { - var me = this; + let me = this; - // this has to be done here, because of - // the way our inputPanel class handles items - me.comboboxes = [ - Ext.createWidget('proxmoxKVComboBox', { - fieldLabel: gettext('Boot device') + " 1", - labelWidth: 120, - name: 'bd1', - allowBlank: false, - listeners: { - change: me.recomputeSelection + // for dirty marking and reset detection + let inUpdate = false; + let marker = Ext.create('Ext.form.field.Base', { + hidden: true, + itemId: 'marker', + setValue: function(val) { + // on form reset, go back to original state + if (!inUpdate) { + me.setVMConfig(me.vmconfig); } - }), - Ext.createWidget('proxmoxKVComboBox', { - fieldLabel: gettext('Boot device') + " 2", - labelWidth: 120, - name: 'bd2', - allowBlank: false, - listeners: { - change: me.recomputeSelection + + // not a subclass, so no callParent; just do it manually + this.setRawValue(this.valueToRaw(val)); + return this.mixins.field.setValue.call(this, val); + } + }); + + let emptyWarning = Ext.create('Ext.form.field.Display', { + userCls: 'pmx-hint', + value: gettext('Warning: No devices selected, the VM will probably not boot!'), + }); + + me.store = Ext.create('Ext.data.Store', { + model: 'pve-boot-order-entry', + listeners: { + update: function() { + this.commitChanges(); + let val = me.calculateValue(); + if (!marker.originalValue) { + marker.originalValue = val; + } + inUpdate = true; + marker.setValue(val); + inUpdate = false; + marker.checkDirty(); + emptyWarning.setHidden(val !== ''); } - }), - Ext.createWidget('proxmoxKVComboBox', { - fieldLabel: gettext('Boot device') + " 3", - labelWidth: 120, - name: 'bd3', - allowBlank: false, - listeners: { - change: me.recomputeSelection + } + }); + + let grid = Ext.create('Ext.grid.Panel', { + store: me.store, + margin: '0 0 5 0', + columns: [ + { + xtype: 'checkcolumn', + header: gettext('Enabled'), + dataIndex: 'enabled', + width: 70, + sortable: false, + hideable: false, + draggable: false, + }, + { + header: gettext('Device'), + dataIndex: 'name', + width: 70, + sortable: false, + hideable: false, + draggable: false, + }, + { + header: gettext('Description'), + dataIndex: 'desc', + flex: true, + sortable: false, + hideable: false, + draggable: false, + }, + ], + viewConfig: { + plugins: { + ptype: 'gridviewdragdrop', + dragText:gettext('Drag and drop to reorder'), } - }) - ]; - Ext.apply(me, { items: me.comboboxes }); + }, + listeners: { + drop: function() { + // doesn't fire automatically on reorder + me.store.fireEvent("update"); + } + }, + }); + + let info = Ext.create('Ext.Component', { + html: gettext('Drag and drop to reorder'), + }); + + Ext.apply(me, { items: [grid, info, emptyWarning, marker] }); + me.callParent(); } }); @@ -157,9 +216,10 @@ Ext.define('PVE.qemu.BootOrderEdit', { }], subject: gettext('Boot Order'), + width: 600, initComponent : function() { - var me = this; + let me = this; me.callParent(); me.load({ success: function(response, options) { diff --git a/www/manager6/qemu/Options.js b/www/manager6/qemu/Options.js index 20f6ffbb..490d2f54 100644 --- a/www/manager6/qemu/Options.js +++ b/www/manager6/qemu/Options.js @@ -86,12 +86,30 @@ Ext.define('PVE.qemu.Options', { bootdisk: { visible: false }, + bootorder: { + visible: false + }, boot: { header: gettext('Boot Order'), defaultValue: 'cdn', editor: caps.vms['VM.Config.Disk'] ? 'PVE.qemu.BootOrderEdit' : undefined, - multiKey: ['boot', 'bootdisk'], + multiKey: ['boot', 'bootdisk', 'bootorder'], renderer: function(order, metaData, record, rowIndex, colIndex, store, pending) { + let bootorder = me.getObjectValue('bootorder', undefined, pending); + if (bootorder) { + let list = bootorder.split(','); + let ret = ''; + list.forEach(dev => { + if (ret !== '') { + ret += ' > '; + } + let desc = dev; + ret += desc; + }); + return ret; + } + + // legacy style and fallback var i; var text = ''; var bootdisk = me.getObjectValue('bootdisk', undefined, pending); @@ -99,20 +117,20 @@ Ext.define('PVE.qemu.Options', { for (i = 0; i < order.length; i++) { var sel = order.substring(i, i + 1); if (text) { - text += ', '; + text += ' > '; } if (sel === 'c') { if (bootdisk) { - text += "Disk '" + bootdisk + "'"; + text += bootdisk; } else { - text += "Disk"; + text += "disk"; } } else if (sel === 'n') { - text += 'Network'; + text += 'any net'; } else if (sel === 'a') { - text += 'Floppy'; + text += 'floppy'; } else if (sel === 'd') { - text += 'CD-ROM'; + text += 'any cdrom'; } else { text += sel; } -- 2.20.1