[Kimchi-devel] [PATCH] [Kimchi 5/6] CPU configuration UI: several improvements
dhbarboza82 at gmail.com
dhbarboza82 at gmail.com
Wed Nov 23 12:11:19 UTC 2016
From: Daniel Henrique Barboza <danielhb at linux.vnet.ibm.com>
- Removed 'More' button from the Processor tab in Edit Template.
This was done to be standardized with the Edit Guest tab that
does not have this button to show/hide the max processor
value.
- Save button state is now being controlled by the init_processor_tab
function (at least inside the Processor tab).
- 'Current CPU' is now editable at all times, in both Edit Guest
and Edit Template dialogs, even when defining a topology. Inserting
a wrong value in the field will invalidate the save state, disabling
the button. When defining a topology and Current CPU has an
inconsistent value, it will be automatically adjusted to be (1)
a multiple of threads or (2) equal to new Max CPU value, in that
order.
- When not defining a topology, setting any Current CPU value greater
than Max CPU will force the field back to the Max CPU value.
Signed-off-by: Daniel Henrique Barboza <danielhb at linux.vnet.ibm.com>
---
ui/css/kimchi.css | 4 --
ui/css/src/modules/_templates.scss | 3 --
ui/js/src/kimchi.guest_edit_main.js | 2 +-
ui/js/src/kimchi.template_edit_main.js | 77 +++++++++++++++++++++++-----------
ui/pages/template-edit.html.tmpl | 1 -
5 files changed, 54 insertions(+), 33 deletions(-)
diff --git a/ui/css/kimchi.css b/ui/css/kimchi.css
index 61d8dc0..1b2c1dd 100644
--- a/ui/css/kimchi.css
+++ b/ui/css/kimchi.css
@@ -1669,10 +1669,6 @@ body.wok-gallery {
display: inline;
}
-#template-edit-window #guest-max-processor-panel {
- display: none;
-}
-
#template-edit-window #guest-show-max-processor {
display: inline-block;
}
diff --git a/ui/css/src/modules/_templates.scss b/ui/css/src/modules/_templates.scss
index eec5878..f72efe9 100644
--- a/ui/css/src/modules/_templates.scss
+++ b/ui/css/src/modules/_templates.scss
@@ -126,9 +126,6 @@ $kimchi-icon-path: '../images';
width: 308px !important;
display: inline;
}
- #guest-max-processor-panel {
- display: none;
- }
#guest-show-max-processor {
display: inline-block;
}
diff --git a/ui/js/src/kimchi.guest_edit_main.js b/ui/js/src/kimchi.guest_edit_main.js
index 0ee0e87..91e5b13 100644
--- a/ui/js/src/kimchi.guest_edit_main.js
+++ b/ui/js/src/kimchi.guest_edit_main.js
@@ -1032,7 +1032,7 @@ kimchi.guest_edit_main = function() {
setupPermission();
setupPCIDevice();
setupSnapshot();
- kimchi.init_processor_tab(guest.cpu_info);
+ kimchi.init_processor_tab(guest.cpu_info, $(saveButton));
wok.topic('kimchi/vmCDROMAttached').subscribe(onAttached);
wok.topic('kimchi/vmCDROMReplaced').subscribe(onReplaced);
diff --git a/ui/js/src/kimchi.template_edit_main.js b/ui/js/src/kimchi.template_edit_main.js
index 36e6911..ecce151 100644
--- a/ui/js/src/kimchi.template_edit_main.js
+++ b/ui/js/src/kimchi.template_edit_main.js
@@ -16,31 +16,52 @@
* limitations under the License.
*/
-kimchi.init_processor_tab = function(cpu_info) {
- var setCPUValue = function(){
+kimchi.init_processor_tab = function(cpu_info, save_form_button) {
+
+ var getMaxVCpus = function() {
if (!$('#sockets').hasClass("invalid-field") &&
!$('#cores').hasClass("invalid-field") &&
- $('#sockets').val()!="" && $('#cores').val()!="") {
+ $('#sockets').val() != "" && $('#cores').val() != "") {
- var sockets = parseInt($("#sockets").val());
- var cores = parseInt($("#cores").val());
- var threads = parseInt($("#threads").val());
+ var sockets = parseInt($("#sockets").val());
+ var cores = parseInt($("#cores").val());
+ var threads = parseInt($("#threads").val());
+ var computedCpu = sockets * cores * threads;
+
+ return computedCpu;
+ }
+ return undefined;
+ };
- var computedCpu = sockets * cores * threads;
- $("#vcpus").val(computedCpu);
- if ($("#cpus-check").prop("checked")) {
- //If topology is checked, set maxcpu to be the same as # of cpu otherwise, backend gives error
- $("#guest-edit-max-processor-textbox").val(computedCpu);
+ var setCPUValue = function() {
+ var computedCpu = getMaxVCpus();
+ var vcpus = parseInt($("#vcpus").val());
+
+ if (computedCpu && $("#cpus-check").prop("checked")) {
+ // If topology is checked, set maxcpu to be the same as # of cpu otherwise, backend gives error
+ var threads = parseInt($("#threads").val());
+ $("#guest-edit-max-processor-textbox").val(computedCpu);
+ if (vcpus % threads != 0) {
+ $("#vcpus").val(threads);
+ } else if (vcpus > computedCpu) {
+ $("#vcpus").val(computedCpu);
}
} else {
- $("#vcpus").val('');
+ var maxCpu = parseInt($("#guest-edit-max-processor-textbox").val());
+ if (vcpus > maxCpu) {
+ $("#vcpus").val(maxCpu);
+ }
}
};
$("input:text", "#form-edit-processor").on('keyup', function() {
- $(this).toggleClass("invalid-field", !$(this).val().match('^[0-9]*$'));
+ var invalid_field = !$(this).val().match('^[0-9]*$');
+ $(this).toggleClass("invalid-field", invalid_field);
+ save_form_button.prop('disabled', invalid_field);
+
if ($(this).prop('id') == 'sockets' ||
- $(this).prop('id') == 'cores') {
+ $(this).prop('id') == 'cores') {
+
setCPUValue();
}
});
@@ -48,7 +69,6 @@ kimchi.init_processor_tab = function(cpu_info) {
$("input:checkbox", "#form-edit-processor").click(function() {
$('#threads').selectpicker();
$(".topology", "#form-edit-processor").slideToggle();
- $("#vcpus").attr("disabled", $(this).prop("checked"));
$("#guest-edit-max-processor-textbox").attr("disabled", $(this).prop("checked"));
setCPUValue();
});
@@ -57,6 +77,23 @@ kimchi.init_processor_tab = function(cpu_info) {
setCPUValue();
});
+ $('#vcpus').change(function() {
+ var computedCpu = getMaxVCpus();
+ var vcpus = parseInt($('#vcpus').val());
+
+ if (computedCpu && $("#cpus-check").prop("checked")) {
+ var threads = parseInt($("#threads").val());
+ var invalid_vcpu = (vcpus % threads != 0) || (vcpus > computedCpu);
+ $(this).toggleClass("invalid-field", invalid_vcpu);
+ save_form_button.prop('disabled', invalid_vcpu);
+ } else {
+ var maxCpu = parseInt($("#guest-edit-max-processor-textbox").val());
+ if (vcpus > maxCpu) {
+ $("#vcpus").val(maxCpu);
+ }
+ }
+ });
+
kimchi.getCPUInfo(function(data) {
var options = "";
var topo = cpu_info.topology;
@@ -86,14 +123,6 @@ kimchi.init_processor_tab = function(cpu_info) {
$("input:checkbox", "#form-edit-processor").trigger('click');
}
});
-
- $('#guest-show-max-processor').on('click', function(e) {
- e.preventDefault;
- $('#guest-max-processor-panel').slideToggle();
- var text = $('#guest-show-max-processor span.text').text();
- $('#guest-show-max-processor span.text').text(text == i18n['KCHVMED6008M'] ? i18n['KCHVMED6009M'] : i18n['KCHVMED6008M']);
- $('#guest-show-max-processor i.fa').toggleClass('fa-plus-circle fa-minus-circle');
- });
};
@@ -748,7 +777,7 @@ kimchi.template_edit_main = function() {
kimchi.listStoragePools(initStorage);
}
- kimchi.init_processor_tab(template.cpu_info);
+ kimchi.init_processor_tab(template.cpu_info, $('#tmpl-edit-button-save'));
checkInvalids();
};
kimchi.retrieveTemplate(kimchi.selectedTemplate, initTemplate);
diff --git a/ui/pages/template-edit.html.tmpl b/ui/pages/template-edit.html.tmpl
index 90e06e4..0939ad8 100644
--- a/ui/pages/template-edit.html.tmpl
+++ b/ui/pages/template-edit.html.tmpl
@@ -156,7 +156,6 @@
<div id="guest-processor">
<label for="vcpus">$_("Current CPU Number")</label>
<input id="vcpus" class="form-control" name="processor" type="number" min="1" />
- <button id="guest-show-max-processor" class="btn btn-primary" type="button"><i class="fa fa-plus-circle"></i> <span class="text">$_("More")</span></button>
</div>
<div id="guest-max-processor-panel" class="form-group">
<label for="guest-edit-max-processor-textbox">$_("Max CPU")</label>
--
2.7.4
More information about the Kimchi-devel
mailing list