4:03 a.m.
From: Royce Lv <lvroyce(a)linux.vnet.ibm.com>
v1>v2, add loading icon before disk query finished
and display mesg when no partition is available.
Add storage pool extend dialog and choose proper disk for extension.
Signed-off-by: Yu Xin Huo <huoyuxin(a)linux.vnet.ibm.com>
Signed-off-by: Royce Lv <lvroyce(a)linux.vnet.ibm.com>
---
ui/js/src/kimchi.api.js | 12 ++++++++
ui/js/src/kimchi.storage_main.js | 47 ++++++++++++++++++++++++++++++++
ui/js/src/kimchi.storagepool_add_main.js | 2 +-
ui/pages/i18n.html.tmpl | 1 +
ui/pages/tabs/storage.html.tmpl | 15 ++++++++++
5 files changed, 76 insertions(+), 1 deletion(-)
diff --git a/ui/js/src/kimchi.api.js b/ui/js/src/kimchi.api.js
index 3c6765c..d30bf10 100644
--- a/ui/js/src/kimchi.api.js
+++ b/ui/js/src/kimchi.api.js
@@ -208,6 +208,18 @@ var kimchi = {
}).done(suc).fail(err);
},
+ updateStoragePool : function(name, content, suc, err) {
+ $.ajax({
+ url : kimchi.url + "storagepools/" + encodeURIComponent(name),
+ type : 'PUT',
+ contentType : 'application/json',
+ dataType : 'json',
+ data : JSON.stringify(content)
+ }).done(suc).fail(err ? err : function(data) {
+ kimchi.message.error(data.responseJSON.reason);
+ });
+ },
+
startVM : function(vm, suc, err) {
kimchi.requestJSON({
url : kimchi.url + 'vms/' + encodeURIComponent(vm) +
'/start',
diff --git a/ui/js/src/kimchi.storage_main.js b/ui/js/src/kimchi.storage_main.js
index 6052510..64d5052 100644
--- a/ui/js/src/kimchi.storage_main.js
+++ b/ui/js/src/kimchi.storage_main.js
@@ -24,6 +24,7 @@ kimchi.doListStoragePools = function() {
value.usage = parseInt(value.allocated / value.capacity * 100) || 0;
value.capacity = kimchi.changetoProperUnit(value.capacity,1);
value.allocated = kimchi.changetoProperUnit(value.allocated,1);
+ value.enableExt = value.type==="logical" ? "" :
"hide-content";
if ('kimchi-iso' !== value.type) {
listHtml += kimchi.template(storageHtml, value);
}
@@ -138,6 +139,11 @@ kimchi.storageBindClick = function() {
}
});
+ $('.pool-extend').on('click', function() {
+ $("#logicalPoolExtend").dialog("option",
"poolName", $(this).data('name'));
+ $("#logicalPoolExtend").dialog("open");
+ });
+
$('#volume-doAdd').on('click', function() {
kimchi.window.open('storagevolume-add.html');
});
@@ -187,11 +193,52 @@ kimchi.doListVolumes = function(poolObj) {
});
}
+kimchi.initLogicalPoolExtend = function() {
+ $("#logicalPoolExtend").dialog({
+ autoOpen : false,
+ modal : true,
+ width : 600,
+ resizable : false,
+ closeText: "X",
+ open : function(){
+ $('#loading-info',
'#logicalPoolExtend').removeClass('hidden');
+ $(".ui-dialog-titlebar-close",
$("#logicalPoolExtend").parent()).removeAttr("title");
+ kimchi.listHostPartitions(function(data) {
+ $('#loading-info',
'#logicalPoolExtend').addClass('hidden');
+ if (data.length > 0) {
+ for(var i=0;i<data.length;i++){
+ if (data[i].type === 'part' || data[i].type ===
'disk') {
+ $('.host-partition',
'#logicalPoolExtend').append(kimchi.template($('#logicalPoolExtendTmpl').html(),
data[i]));
+ }
+ }
+ } else {
+ $('.host-partition').html(i18n['KCHPOOL6011M']);
+ $('.host-partition').addClass('text-help');
+ }
+ });
+ },
+ beforeClose : function() { $('.host-partition',
'#logicalPoolExtend').empty(); },
+ buttons : [{
+ class: "ui-button-primary",
+ text: i18n.KCHAPI6007M,
+ click: function(){
+ var devicePaths = [];
+ $("input[type='checkbox']:checked",
"#logicalPoolExtend").each(function(){
+ devicePaths.push($(this).prop('value'));
+ })
+
kimchi.updateStoragePool($("#logicalPoolExtend").dialog("option",
"poolName"),{disks: devicePaths});
+ $(this).dialog("close");
+ }
+ }]
+ });
+}
+
kimchi.storage_main = function() {
$('#storage-pool-add').on('click', function() {
kimchi.window.open('storagepool-add.html');
});
kimchi.doListStoragePools();
+ kimchi.initLogicalPoolExtend();
}
kimchi.changeArrow = function(obj) {
diff --git a/ui/js/src/kimchi.storagepool_add_main.js
b/ui/js/src/kimchi.storagepool_add_main.js
index 86dbe7f..bc57601 100644
--- a/ui/js/src/kimchi.storagepool_add_main.js
+++ b/ui/js/src/kimchi.storagepool_add_main.js
@@ -33,7 +33,7 @@ kimchi.initStorageAddPage = function() {
listHtml += kimchi.template(deviceHtml, value);
}
});
- $('.host-partition').html(listHtml);
+ $('.host-partition', '#form-pool-add').html(listHtml);
} else {
$('.host-partition').html(i18n['KCHPOOL6011M']);
$('.host-partition').addClass('text-help');
diff --git a/ui/pages/i18n.html.tmpl b/ui/pages/i18n.html.tmpl
index 98da828..f7977c8 100644
--- a/ui/pages/i18n.html.tmpl
+++ b/ui/pages/i18n.html.tmpl
@@ -58,6 +58,7 @@ var i18n = {
'KCHAPI6004M': "$_("Confirm")",
'KCHAPI6005M': "$_("Create")",
'KCHAPI6006M': "$_("Warning")",
+ 'KCHAPI6007M': "$_("Save")",
'KCHGRD6001M': "$_("Loading...")",
'KCHGRD6002M': "$_("An error occurs while checking for packages
update.")",
diff --git a/ui/pages/tabs/storage.html.tmpl b/ui/pages/tabs/storage.html.tmpl
index c3a992e..d4d54ea 100644
--- a/ui/pages/tabs/storage.html.tmpl
+++ b/ui/pages/tabs/storage.html.tmpl
@@ -41,6 +41,14 @@
</div>
<ul id="storagepoolsList" class="list-storage
empty-when-logged-off"></ul>
</div>
+<div id="logicalPoolExtend" title="$_("Device
path")">
+ <p id="loading-info" class="text-help">
+ <img src = "../images/theme-default/loading.gif" />
+ $_("Looking for available partitions ...")
+ </p>
+ <div class="host-partition">
+ </div>
+</div>
<script id="storageTmpl" type="html/text">
<li id="{name}">
<div class="storage-li in" data-name="{name}"
data-stat="{state}">
@@ -74,6 +82,7 @@
<div class="popover actionsheet right-side"
style="width: 250px">
<button class="button-big pool-deactivate"
data-stat="{state}" data-name="{name}"
data-persistent="{persistent}"><span
class="text">$_("Deactivate")</span></button>
<button class="button-big pool-activate"
data-stat="{state}" data-name="{name}"><span
class="text">$_("Activate")</span></button>
+ <button class="button-big pool-extend {enableExt}"
data-stat="{state}" data-name="{name}"><span
class="text">$_("Extend")</span></button>
<button class="button-big red pool-delete"
data-stat="{state}" data-name="{name}"><span
class="text">$_("Undefine")</span></button>
</div>
</div>
@@ -107,6 +116,12 @@
</div>
</div>
</script>
+<script id="logicalPoolExtendTmpl" type="html/text">
+ <div>
+ <input type="checkbox" value="{path}"
name="devices">
+ <label for="{name}">{path}</label>
+ </div>
+</script>
<script>
kimchi.storage_main();
</script>
--
1.8.3.2