[Kimchi-devel] [PATCH] [Kimchi] Bug fix #521: Extend logical pool
Aline Manera
alinefm at linux.vnet.ibm.com
Tue Sep 27 14:05:04 UTC 2016
Hey,
It is easy to verify this patch by running wok on test mode:
wokd --test
Enjoy! =)
On 09/27/2016 12:18 AM, Aline Manera wrote:
> This patch proper shows the extend logical pool dialog to collect user
> information and do the request.
>
> Signed-off-by: Aline Manera <alinefm at linux.vnet.ibm.com>
> ---
> ui/css/kimchi.css | 3 +-
> ui/css/src/modules/_guests.scss | 3 +-
> ui/js/src/kimchi.storage_main.js | 81 ++++++++++++++++++++------------
> ui/js/src/kimchi.storagepool_add_main.js | 2 +-
> ui/pages/i18n.json.tmpl | 9 ++--
> ui/pages/tabs/storage.html.tmpl | 45 +++++++++---------
> 6 files changed, 83 insertions(+), 60 deletions(-)
>
> diff --git a/ui/css/kimchi.css b/ui/css/kimchi.css
> index 959508f..9a9ff25 100644
> --- a/ui/css/kimchi.css
> +++ b/ui/css/kimchi.css
> @@ -294,7 +294,8 @@
> font-size: 32px;
> }
>
> -#wok-confirm-modal .modal-body strong {
> +#wok-confirm-modal .modal-body strong,
> +.modal-dialog .modal-body strong {
> border-bottom: 1px dotted;
> }
>
> diff --git a/ui/css/src/modules/_guests.scss b/ui/css/src/modules/_guests.scss
> index 237b395..4947123 100644
> --- a/ui/css/src/modules/_guests.scss
> +++ b/ui/css/src/modules/_guests.scss
> @@ -46,7 +46,8 @@
> }
> }
>
> -#wok-confirm-modal .modal-body strong {
> +#wok-confirm-modal .modal-body strong,
> +.modal-dialog .modal-body strong {
> border-bottom: 1px dotted;
> }
>
> diff --git a/ui/js/src/kimchi.storage_main.js b/ui/js/src/kimchi.storage_main.js
> index 0d7a6d7..741fd59 100644
> --- a/ui/js/src/kimchi.storage_main.js
> +++ b/ui/js/src/kimchi.storage_main.js
> @@ -410,10 +410,8 @@ kimchi.storageBindClick = function() {
>
> $('.pool-extend').on('click', function(event) {
> event.preventDefault();
> - //$("#logicalPoolExtend").dialog("option", "poolName", $(this).data('name'));
> - //$("#logicalPoolExtend").dialog("open");
> - partitions = $(this).data('name');
> - //$("#logicalPoolExtend").dialog("option", "poolName", $(this).data('name'));
> + var poolName = $(this).data('name');
> + kimchi.selectedSP = poolName;
> });
> }
>
> @@ -478,17 +476,23 @@ kimchi._generateVolumeHTML = function(volume) {
> return volumeHtml[0].outerHTML;
> };
>
> +
> +kimchi.getPoolUsageIcon = function(usage) {
> + if (usage <= 100 && usage >= 85)
> + return 'icon-high';
> +
> + if (usage <= 85 && usage >= 75)
> + return 'icon-med';
> +
> + return 'icon-low';
> +};
> +
> +
> kimchi.doUpdateStoragePool = function(poolObj){
> var poolName = poolObj.data('name');
> kimchi.getStoragePool(poolName, function(result) {
> result.usage = Math.round(result.allocated / result.capacity * 100) || 0;
> - if (result.usage <= 100 && result.usage >= 85) {
> - result.icon = 'icon-high';
> - }else if (result.usage <= 85 && result.usage >= 75 ) {
> - result.icon = 'icon-med';
> - } else {
> - result.icon = 'icon-low';
> - }
> + result.icon = kimchi.getPoolUsageIcon(result.usage);
> result.allocated = wok.changetoProperUnit(result.allocated,1);
> $('> .column-usage > .usage-icon',poolObj).attr('class', 'usage-icon').addClass(result.icon).text(result.usage);
> $('> .column-allocated',poolObj).attr('val',result.allocated).text(result.allocated);
> @@ -649,30 +653,45 @@ kimchi.doListVolumes = function(poolObj) {
> }, false);
> };
>
> - kimchi.initLogicalPoolExtend = function() {
> -
> +kimchi.initLogicalPoolExtend = function() {
> $('#logicalPoolExtend').on('hidden.bs.modal', function () {
> $('.host-partition', '#logicalPoolExtend').empty();
> });
>
> $('#logicalPoolExtend').on('show.bs.modal', function() {
> - //$('#logicalPoolExtend2').find('.modal-content').html();
> - kimchi.listHostPartitions(function(partitions) {
> - $('#loading-info', '#logicalPoolExtend').removeClass('hidden');
> - if (partitions.length > 0) {
> - for (var i = 0; i < partitions.length; i++) {
> - if (partitions[i].type === 'part' || partitions[i].type === 'disk') {
> - $('.host-partition', '#logicalPoolExtend').append(wok.substitute($('#logicalPoolExtendTmpl').html(), partitions[i]));
> - $('#savePartitions', '#logicalPoolExtend').prop('disabled', false);
> + // Make any change in the form fields enables the
> + // 'savePartitions' button if all the visible form
> + // fields are filled, disables it otherwise.
> + $('#logicalPoolExtend').on('input change propertychange', function() {
> + if ($("input[name=devices]:checked").length === 0) {
> + $("#savePartitions").attr("disabled", true);
> + }
> + else {
> + $("#savePartitions").attr("disabled", false);
> + }
> + });
> +
> + kimchi.listHostPartitions(function(data) {
> + if (data.length > 0) {
> + var deviceHtml = $('#partitionTmpl').html();
> + var listHtml = '<table class="table table-hover"><thead><tr><th></th><th>Device</th><th>Path</th><th>Size (GiB)</th></tr></thead><tbody>';
> + valid_types = ['part', 'disk', 'mpath'];
> + $.each(data, function(index, value) {
> + if (valid_types.indexOf(value.type) !== -1) {
> + value.size = (value.size / 1000000000).toFixed(2);
> + listHtml += wok.substitute(deviceHtml, value);
> }
> - }
> + });
> + listHtml += '</tbody></table>';
> + var infoHtml = '<h3>' + i18n['KCHPOOL6019M'].replace('%1', '<strong>' + kimchi.selectedSP + '</strong>') + '</h3>';
> + $('.host-partition', '#logicalPoolExtend').html(infoHtml + listHtml);
> } else {
> - $('#loading-info', '#logicalPoolExtend').addClass('hidden');
> $('.host-partition').html(i18n['KCHPOOL6011M']);
> + $('.host-partition').addClass('text-help');
> }
> }, function(err) {
> - $('#loading-info', '#logicalPoolExtend').addClass('hidden');
> $('.host-partition').html(i18n['KCHPOOL6013M'] + '<br/>(' + err.responseJSON.reason + ')');
> + $('.host-partition').addClass('text-help');
> });
>
> $('#savePartitions', '#logicalPoolExtend').on('click', function(event) {
> @@ -681,14 +700,16 @@ kimchi.doListVolumes = function(poolObj) {
> $("input[type='checkbox']:checked", "#logicalPoolExtend").each(function() {
> devicePaths.push($(this).prop('value'));
> });
> - kimchi.updateStoragePool($("#logicalPoolExtend"), {
> + kimchi.updateStoragePool(kimchi.selectedSP, {
> disks: devicePaths
> - }, function(partitions) {
> - var item = $("#" + $("#logicalPoolExtend").dialog("option", "poolName"));
> + }, function(pool) {
> $('#logicalPoolExtend').modal('hide');
> - $(".usage", $(".storage-name", item)).text((Math.round(partitions.allocated / partitions.capacity * 100) || 0) + "%");
> - $(".storage-text", $(".storage-capacity", item)).text(wok.changetoProperUnit(partitions.capacity, 1));
> - $(".storage-text", $(".storage-allocate", item)).text(wok.changetoProperUnit(partitions.allocated, 1));
> + var item = '#' + pool.name;
> + var usage = Math.round(pool.allocated / pool.capacity * 100) || 0;
> + var usageIcon = kimchi.getPoolUsageIcon(usage);
> + $(".usage-icon", $(".column-usage", item)).attr('class', 'usage-icon').addClass(usageIcon).text(usage);
> + $(".column-capacity", item).text(wok.changetoProperUnit(pool.capacity, 1));
> + $(".column-allocated", item).text(wok.changetoProperUnit(pool.allocated, 1));
> }, function(err) {
> $('#savePartitions', '#logicalPoolExtend').prop('disabled', true);
> $('#logicalPoolExtend').modal('hide');
> diff --git a/ui/js/src/kimchi.storagepool_add_main.js b/ui/js/src/kimchi.storagepool_add_main.js
> index 3fe2548..5a020ee 100644
> --- a/ui/js/src/kimchi.storagepool_add_main.js
> +++ b/ui/js/src/kimchi.storagepool_add_main.js
> @@ -127,7 +127,7 @@ kimchi.initStorageAddPage = function() {
> kimchi.listHostPartitions(function(data) {
> if (data.length > 0) {
> var deviceHtml = $('#partitionTmpl').html();
> - var listHtml = '<table class="table table-hover"><thead><tr><th></th><th>device</th><th>path</th><th>size (GiB)</th></tr></thead><tbody>';
> + var listHtml = '<table class="table table-hover"><thead><tr><th></th><th>Device</th><th>Path</th><th>Size (GiB)</th></tr></thead><tbody>';
> valid_types = ['part', 'disk', 'mpath'];
> $.each(data, function(index, value) {
> if (valid_types.indexOf(value.type) !== -1) {
> diff --git a/ui/pages/i18n.json.tmpl b/ui/pages/i18n.json.tmpl
> index 7beee19..c67e9e8 100644
> --- a/ui/pages/i18n.json.tmpl
> +++ b/ui/pages/i18n.json.tmpl
> @@ -103,10 +103,6 @@
> "KCHPOOL6008M": "$_("Failed to load iSCSI targets.")",
> "KCHPOOL6009M": "$_("Would you like to continue?")",
> "KCHPOOL6010M": "$_("This will permanently delete the following storage volumes: %1")",
> -
> - "KCHPOOL6005E": "$_("Invalid NFS mount path.")",
> - "KCHPOOL6006E": "$_("No logical device selected.")",
> - "KCHPOOL6009E": "$_("This is not a valid Server Name or IP. Please, modify it.")",
> "KCHPOOL6011M": "$_("No available partitions found.")",
> "KCHPOOL6012M": "$_("The %1 storage pool is not persistent. Instead of deactivate, this action will permanently delete it. Would you like to continue?")",
> "KCHPOOL6013M": "$_("Unable to retrieve partitions information.")",
> @@ -115,6 +111,11 @@
> "KCHPOOL6016M": "$_("No LVM found in the system.")",
> "KCHPOOL6017M": "$_("This will permanently wipe the following storage volumes: %1")",
> "KCHPOOL6018M": "$_("Wipe Confirmation")",
> + "KCHPOOL6019M": "$_("Select one or more partitions to be added to the logical pool %1:")",
> +
> + "KCHPOOL6005E": "$_("Invalid NFS mount path.")",
> + "KCHPOOL6006E": "$_("No logical device selected.")",
> + "KCHPOOL6009E": "$_("This is not a valid Server Name or IP. Please, modify it.")",
>
> "KCHVMSTOR0001E": "$_("CDROM path needs to be a valid local/remote path and cannot be blank.")",
> "KCHVMSTOR0002E": "$_("Disk pool or volume cannot be blank.")",
> diff --git a/ui/pages/tabs/storage.html.tmpl b/ui/pages/tabs/storage.html.tmpl
> index 92d9b75..4215d55 100644
> --- a/ui/pages/tabs/storage.html.tmpl
> +++ b/ui/pages/tabs/storage.html.tmpl
> @@ -74,21 +74,21 @@
> <div id="logicalPoolExtend" class="modal fade logicalpool-modal" tabindex="-2" role="dialog" aria-labelledby="logicalPoolExtendLabel" aria-hidden="true">
> <div class="modal-dialog modal-sm">
> <div class="modal-content">
> - <div class="modal-header">
> + <div class="modal-header">
> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
> - <h4 class="modal-title" id="logicalPoolExtendLabel">$_("Device path")</h4>
> - </div>
> - <div class="modal-body">
> - <p id="loading-info" class="hidden"><span class="wok-loading-icon"></span><span>$_("Looking for available partitions ...")</span></p>
> - <div class="host-partition">
> - </div>
> - </div>
> - <div class="modal-footer">
> - <button type="button" id="savePartitions" class="btn btn-default" disabled="disabled">$_("Save")</button>
> - <button type="button" class="btn btn-default" data-dismiss="modal">$_("Cancel")</button>
> - </div>
> + <h4 class="modal-title" id="logicalPoolExtendLabel">$_("Extending logical pool")</h4>
> + </div>
> + <div class="modal-body">
> + <div class="host-partition">
> + <span class="wok-loading-icon"></span><span>$_("Looking for available partitions ...")</span>
> + </div>
> + </div>
> + <div class="modal-footer">
> + <button type="button" id="savePartitions" class="btn btn-default" disabled="disabled">$_("Save")</button>
> + <button type="button" class="btn btn-default" data-dismiss="modal">$_("Cancel")</button>
> + </div>
> </div>
> - </div>
> + </div>
> </div>
> </div>
> <div class="wok-mask">
> @@ -200,17 +200,16 @@
> </div>
> </li>
> </script>
> -<script id="logicalPoolExtendTmpl" type="html/text">
> - <div>
> - <input type="checkbox" class="wok-checkbox" id="{name}" value="{path}" name="devices">
> - <label for="{name}">
> - <div>
> - <span class="device-name">{name}</span>
> - <span class="device-path">{path}</span>
> - </div>
> - </label>
> - </div>
> +
> +<script id="partitionTmpl" type="html/text">
> + <tr>
> + <td><input type="checkbox" class="wok-checkbox" id="{name}" value="{path}" name="devices"><label for="{name}"></label></td>
> + <td>{name}</td>
> + <td>{path}</td>
> + <td>{size}</td>
> + </tr>
> </script>
> +
> <script>
> kimchi.storage_main();
> </script>
More information about the Kimchi-devel
mailing list