[Kimchi-devel] [v3] UI: CPU Topology

Christy Perez christy at linux.vnet.ibm.com
Mon Nov 24 17:09:48 UTC 2014


Reviewed-By: Christy Perez <christy at linux.vnet.ibm.com>
Tested-By: Christy Perez <christy at linux.vnet.ibm.com>

Manually tested:
- Template create
- Template edit topo
- VM create with topo template (verified topo was added to guest xml)
- Template edit with too many vcpus (sockets *  cores * threads > total
host threads) resulted in the appropriate error
- Template delete

Thanks!


On 11/24/2014 02:05 AM, huoyuxin at linux.vnet.ibm.com wrote:
> From: Yu Xin Huo <huoyuxin at linux.vnet.ibm.com>
> 
> Signed-off-by: Yu Xin Huo <huoyuxin at linux.vnet.ibm.com>
> ---
>  ui/css/theme-default/template-edit.css |   28 ++++++++++++++++-
>  ui/js/src/kimchi.api.js                |   14 ++++++++
>  ui/js/src/kimchi.template_edit_main.js |   52 ++++++++++++++++++++++++++++++-
>  ui/pages/template-edit.html.tmpl       |   19 +++++++----
>  4 files changed, 103 insertions(+), 10 deletions(-)
> 
> diff --git a/ui/css/theme-default/template-edit.css b/ui/css/theme-default/template-edit.css
> index 094e909..7abee7c 100644
> --- a/ui/css/theme-default/template-edit.css
> +++ b/ui/css/theme-default/template-edit.css
> @@ -142,4 +142,30 @@
> 
>  #edit-template-tabs .hide {
>      display: none;
> -}
> \ No newline at end of file
> +}
> +
> +#form-template-processor select,
> +#form-template-processor input[type="text"] {
> +    margin-left: 10px;
> +}
> +
> +#form-template-processor input[type="checkbox"] {
> +    margin-right: 5px;
> +}
> +
> +#form-template-processor .manual {
> +    margin-top: 10px;
> +    margin-left: -3px;
> +}
> +
> +#form-template-processor .topology {
> +    margin: 10px 30px;
> +}
> +
> +#form-template-processor .topology div {
> +    margin-bottom: 10px;
> +}
> +
> +#form-template-processor .topology select {
> +    width: 80px;
> +}
> diff --git a/ui/js/src/kimchi.api.js b/ui/js/src/kimchi.api.js
> index 78c6d66..7a239c0 100644
> --- a/ui/js/src/kimchi.api.js
> +++ b/ui/js/src/kimchi.api.js
> @@ -1260,5 +1260,19 @@ var kimchi = {
>                  kimchi.message.error(data.responseJSON.reason);
>              }
>          });
> +    },
> +
> +    getCPUInfo : function(suc, err) {
> +        kimchi.requestJSON({
> +            url : kimchi.url + 'host/cpuinfo',
> +            type : 'GET',
> +            contentType : 'application/json',
> +            dataType : 'json',
> +            resend : true,
> +            success : suc,
> +            error : err ? err : function(data) {
> +                kimchi.message.error(data.responseJSON.reason);
> +            }
> +        });
>      }
>  };
> diff --git a/ui/js/src/kimchi.template_edit_main.js b/ui/js/src/kimchi.template_edit_main.js
> index d4e19c2..1149541 100644
> --- a/ui/js/src/kimchi.template_edit_main.js
> +++ b/ui/js/src/kimchi.template_edit_main.js
> @@ -200,14 +200,51 @@ kimchi.template_edit_main = function() {
>                  });
>              });
>          };
> +        var initProcessor = function(){
> +            var setCPUValue = function(){
> +                if(!$('#cores').hasClass("invalid-field")&&$('#cores').val()!=""){
> +                    $("#cpus").val(parseInt($("#cores").val())*parseInt($("#threads").val()));
> +                }else{
> +                    $("#cpus").val('');
> +                }
> +            };
> +            $("input:text", "#form-template-processor").on('keyup', function(){
> +                $(this).toggleClass("invalid-field", !$(this).val().match('^[0-9]*$'));
> +                if($(this).prop('id')=='cores') setCPUValue();
> +            });
> +            $("input:checkbox", "#form-template-processor").click(function(){
> +                $(".topology", "#form-template-processor").toggleClass("hide", !$(this).prop("checked"));
> +                $("#cpus").attr("disabled", $(this).prop("checked"));
> +                setCPUValue();
> +            });
> +            $('select', '#form-template-processor').change(function(){
> +                setCPUValue();
> +            });
> +            kimchi.getCPUInfo(function(data){
> +                var options = "";
> +                for(var i=0;Math.pow(2,i)<=data.threads_per_core;i++){
> +                    var lastOne = Math.pow(2,i+1)>data.threads_per_core?" selected":"";
> +                    options += "<option"+lastOne+">"+Math.pow(2,i)+"</option>";
> +                }
> +                $('select', '#form-template-processor').append(options);
> +                if(template.cpus) $("#cpus").val(template.cpus);
> +                var topo = template.cpu_info.topology;
> +                if(topo&&topo.cores) $("#cores").val(topo.cores);
> +                if(topo&&topo.threads){
> +                    $('select', '#form-template-processor').val(topo.threads);
> +                    $("input:checkbox", "#form-template-processor").trigger('click');
> +                }
> +            });
> +        };
>          kimchi.listNetworks(initInterface);
>          kimchi.listStoragePools(initStorage);
> +        initProcessor();
>      };
>      kimchi.retrieveTemplate(kimchi.selectedTemplate, initTemplate);
> 
> 
>      $('#tmpl-edit-button-save').on('click', function() {
> -        var editableFields = [ 'name', 'cpus', 'memory', 'disks', 'graphics'];
> +        var editableFields = [ 'name', 'memory', 'disks', 'graphics'];
>          var data = {};
>          //Fix me: Only support one storage pool now
>          var storages = $('.template-tab-body .item', '#form-template-storage');
> @@ -241,7 +278,18 @@ kimchi.template_edit_main = function() {
>              }
>          });
>          data['memory'] = Number(data['memory']);
> -        data['cpus']   = Number(data['cpus']);
> +        data['cpus']   = parseInt($('#cpus').val());
> +        if($("input:checkbox", "#form-template-processor").prop("checked")){
> +            data['cpu_info'] = {
> +                topology: {
> +                    sockets: 1,
> +                    cores: parseInt($("#cores").val()),
> +                    threads: parseInt($("#threads").val())
> +                }
> +            };
> +        }else{
> +            data['cpu_info'] = {};
> +        }
>          var networks = $('.template-tab-body .item', '#form-template-interface');
>          var networkForUpdate = new Array();
>          $.each(networks, function(index, networkEntities) {
> diff --git a/ui/pages/template-edit.html.tmpl b/ui/pages/template-edit.html.tmpl
> index 90a6256..7177bf0 100644
> --- a/ui/pages/template-edit.html.tmpl
> +++ b/ui/pages/template-edit.html.tmpl
> @@ -40,6 +40,9 @@
>                  <li>
>                      <a href="#form-template-interface">$_("Interface")</a>
>                  </li>
> +                <li>
> +                    <a href="#form-template-processor">$_("Processor")</a>
> +                </li>
>              </ul>
>              <form id="form-template-general">
>                  <div class="form-template-inline-wrapper">
> @@ -53,9 +56,6 @@
>                          <label for="template-edit-version-textbox">$_("Version")</label>
>                      </div>
>                      <div class="template-edit-wrapper-label">
> -                        <label for="template-edit-cpu-textbox">$_("CPU Number")</label>
> -                    </div>
> -                    <div class="template-edit-wrapper-label">
>                          <label for="template-edit-memory-textbox">$_("Memory (MB)")</label>
>                      </div>
>                      <div class="template-edit-wrapper-label templ-edit-cdrom">
> @@ -79,9 +79,6 @@
>                          <input id="template-edit-version-textbox" name="os_version" type="text" disabled="disabled" />
>                      </div>
>                      <div class="template-edit-wrapper-controls">
> -                        <input id="template-edit-cpu-textbox" name="cpus" type="text" />
> -                    </div>
> -                    <div class="template-edit-wrapper-controls">
>                          <input id="template-edit-memory-textbox" name="memory" type="text" />
>                      </div>
>                      <div class="template-edit-wrapper-controls templ-edit-cdrom">
> @@ -120,6 +117,14 @@
>                  </div>
>                  <div class="template-tab-body"></div>
>              </form>
> +            <form id="form-template-processor">
> +                <div>$_("CPU Number"):<input type="text" value="1" id="cpus"></div>
> +                <div class="manual"><input type="checkbox">$_("Manually set CPU topology")</div>
> +                <div class="topology hide">
> +                    <div>$_("Cores"):<input type="text" value="1"  id="cores"></div>
> +                    <div>$_("Threads"):<select id="threads"></select></div>
> +                </div>
> +            </form>
>          </div>
>      </div>
>      <footer>
> @@ -157,4 +162,4 @@
>              <button class="delete"></button>
>          </span>
>      </div>
> -</script>
> \ No newline at end of file
> +</script>
> 




More information about the Kimchi-devel mailing list