[PATCH 1/2] Add the nfs server select UI
This patch is working adding a select box in create nfs pool, when user don't want to input the server ip or name, he can simply select "used the server I have used before" and choose a server in a select box, this is more convinent. Signed-off-by: zhoumeina <zhoumein@linux.vnet.ibm.com> --- ui/css/theme-default/storage.css | 2 +- ui/js/src/kimchi.api.js | 2 +- ui/js/src/kimchi.storagepool_add_main.js | 32 ++++++++++++++++++----------- ui/pages/i18n.html.tmpl | 3 +- ui/pages/storagepool-add.html.tmpl | 17 +++++++-------- 5 files changed, 32 insertions(+), 24 deletions(-) diff --git a/ui/css/theme-default/storage.css b/ui/css/theme-default/storage.css index 7bb685f..ae89f1b 100644 --- a/ui/css/theme-default/storage.css +++ b/ui/css/theme-default/storage.css @@ -548,7 +548,7 @@ .storage-type-wrapper-controls > .dropdown { margin: 5px 0 0 1px; - width: 100px; + width: 150px; } .storage-type-wrapper-controls input[type="text"][disabled] { diff --git a/ui/js/src/kimchi.api.js b/ui/js/src/kimchi.api.js index 0461b30..3af1673 100644 --- a/ui/js/src/kimchi.api.js +++ b/ui/js/src/kimchi.api.js @@ -684,7 +684,7 @@ var kimchi = { }, getStorageServers: function(type, suc, err) { - var url = kimchi.url + 'storageservers?type=' + type; + var url = kimchi.url + 'storageservers?target_type=' + type; kimchi.requestJSON({ url : url, type : 'GET', diff --git a/ui/js/src/kimchi.storagepool_add_main.js b/ui/js/src/kimchi.storagepool_add_main.js index 42c6bf5..5cd5b15 100644 --- a/ui/js/src/kimchi.storagepool_add_main.js +++ b/ui/js/src/kimchi.storagepool_add_main.js @@ -52,6 +52,23 @@ kimchi.initStorageAddPage = function() { $('.host-partition').html(listHtml); } kimchi.select('storagePool-list', options); + kimchi.getStorageServers('netfs', function(data) { + console.log($("#nfsServerSelect").val()); + var serverContent = []; + serverContent.push({ + label : i18n['select_default'], + value : '' + }); + if (data.length > 0) { + $.each(data, function(index, value) { + serverContent.push({ + label : value, + value : value + }); + }); + } + kimchi.select('nfs-server-used', serverContent); + }); $('#poolType').change(function() { if ($(this).val() === 'dir') { $('.path-section').removeClass('tmpl-html'); @@ -74,20 +91,11 @@ kimchi.initStorageAddPage = function() { } else { $('#nfsServerInputDiv').addClass('tmpl-html'); $('#nfsServerChooseDiv').removeClass('tmpl-html'); - kimchi.getStorageServers('netfs', function(data) { - var serverContent = []; - if (data.length > 0) { - $.each(data, function(index, value) { - serverContent.push({ - label : data.value, - value : data.value - }); - }); - } - kimchi.select('nfs-server-used', serverContent); - }); } }); + $('#nfsServerSelect').change(function() { + $('#nfsserverId').val($(this).val()); + }); }); }; diff --git a/ui/pages/i18n.html.tmpl b/ui/pages/i18n.html.tmpl index c1fc3d1..45c301d 100644 --- a/ui/pages/i18n.html.tmpl +++ b/ui/pages/i18n.html.tmpl @@ -121,7 +121,8 @@ var i18n = { 'action_create': "$_("Create")", 'msg_warning': "$_("Warning")", 'msg.logicalpool.confirm.delete': "$_("It will format your disk and you will loose any data in" - " there, are you sure to continue? ")" + " there, are you sure to continue? ")", + 'select_default': "$_("Please choose")", }; </script> </body> diff --git a/ui/pages/storagepool-add.html.tmpl b/ui/pages/storagepool-add.html.tmpl index 9d16ae6..31af028 100644 --- a/ui/pages/storagepool-add.html.tmpl +++ b/ui/pages/storagepool-add.html.tmpl @@ -83,19 +83,18 @@ <input id="nfsserverId" type="text" class="text" style="width: 300px"> </div> - <div id="nfsServerChooseDiv" class="tmpl-html"> + <div id="nfsServerChooseDiv" class="field tmpl-html" style="overflow:visible"> <p class="text-help"> $_("Please choose the nfs server you want to create storage pool.")</p> - <div class="storage-type-wrapper-controls"> - <div class="btn-select dropdown popable"> - <span class="text" id="nfs-server-label"></span><span class="arrow"></span> - <div class="popover" style="width: 100%"> - <ul class="select-list" id="nfs-server-used" data-target="nfsServerSelect" data-label="nfs-server-label"> - </ul> + <div class="btn-select dropdown popable" style="width: 285px"> + <input id="nfsServerSelect" type="hidden"/> + <span class="text" id="nfs-server-label"></span><span class="arrow"></span> + <div class="popover" style="width: 100%"> + <ul class="select-list" id="nfs-server-used" data-target="nfsServerSelect" data-label="nfs-server-label"> + </ul> + </div> </div> </div> - </div> - </div> </section> <section class="form-section"> <h2>4. $_("NFS Path")</h2> -- 1.7.1
Does this patch depend on another patch ?? I was not able to apply and test it, even manually ... there are pieces missing. On 12/24/2013 12:21 AM, zhoumeina wrote:
This patch is working adding a select box in create nfs pool, when user don't want to input the server ip or name, he can simply select "used the server I have used before" and choose a server in a select box, this is more convinent. Signed-off-by: zhoumeina <zhoumein@linux.vnet.ibm.com> --- ui/css/theme-default/storage.css | 2 +- ui/js/src/kimchi.api.js | 2 +- ui/js/src/kimchi.storagepool_add_main.js | 32 ++++++++++++++++++----------- ui/pages/i18n.html.tmpl | 3 +- ui/pages/storagepool-add.html.tmpl | 17 +++++++-------- 5 files changed, 32 insertions(+), 24 deletions(-)
diff --git a/ui/css/theme-default/storage.css b/ui/css/theme-default/storage.css index 7bb685f..ae89f1b 100644 --- a/ui/css/theme-default/storage.css +++ b/ui/css/theme-default/storage.css @@ -548,7 +548,7 @@
.storage-type-wrapper-controls > .dropdown { margin: 5px 0 0 1px; - width: 100px; + width: 150px; }
.storage-type-wrapper-controls input[type="text"][disabled] { diff --git a/ui/js/src/kimchi.api.js b/ui/js/src/kimchi.api.js index 0461b30..3af1673 100644 --- a/ui/js/src/kimchi.api.js +++ b/ui/js/src/kimchi.api.js @@ -684,7 +684,7 @@ var kimchi = { },
getStorageServers: function(type, suc, err) { - var url = kimchi.url + 'storageservers?type=' + type; + var url = kimchi.url + 'storageservers?target_type=' + type; kimchi.requestJSON({ url : url, type : 'GET', diff --git a/ui/js/src/kimchi.storagepool_add_main.js b/ui/js/src/kimchi.storagepool_add_main.js index 42c6bf5..5cd5b15 100644 --- a/ui/js/src/kimchi.storagepool_add_main.js +++ b/ui/js/src/kimchi.storagepool_add_main.js @@ -52,6 +52,23 @@ kimchi.initStorageAddPage = function() { $('.host-partition').html(listHtml); } kimchi.select('storagePool-list', options); + kimchi.getStorageServers('netfs', function(data) { + console.log($("#nfsServerSelect").val()); + var serverContent = []; + serverContent.push({ + label : i18n['select_default'], + value : '' + }); + if (data.length > 0) { + $.each(data, function(index, value) { + serverContent.push({ + label : value, + value : value + }); + }); + } + kimchi.select('nfs-server-used', serverContent); + }); $('#poolType').change(function() { if ($(this).val() === 'dir') { $('.path-section').removeClass('tmpl-html'); @@ -74,20 +91,11 @@ kimchi.initStorageAddPage = function() { } else { $('#nfsServerInputDiv').addClass('tmpl-html'); $('#nfsServerChooseDiv').removeClass('tmpl-html'); - kimchi.getStorageServers('netfs', function(data) { - var serverContent = []; - if (data.length > 0) { - $.each(data, function(index, value) { - serverContent.push({ - label : data.value, - value : data.value - }); - }); - } - kimchi.select('nfs-server-used', serverContent); - }); } }); + $('#nfsServerSelect').change(function() { + $('#nfsserverId').val($(this).val()); + }); }); };
diff --git a/ui/pages/i18n.html.tmpl b/ui/pages/i18n.html.tmpl index c1fc3d1..45c301d 100644 --- a/ui/pages/i18n.html.tmpl +++ b/ui/pages/i18n.html.tmpl @@ -121,7 +121,8 @@ var i18n = { 'action_create': "$_("Create")", 'msg_warning': "$_("Warning")", 'msg.logicalpool.confirm.delete': "$_("It will format your disk and you will loose any data in" - " there, are you sure to continue? ")" + " there, are you sure to continue? ")", + 'select_default': "$_("Please choose")", }; </script> </body> diff --git a/ui/pages/storagepool-add.html.tmpl b/ui/pages/storagepool-add.html.tmpl index 9d16ae6..31af028 100644 --- a/ui/pages/storagepool-add.html.tmpl +++ b/ui/pages/storagepool-add.html.tmpl @@ -83,19 +83,18 @@ <input id="nfsserverId" type="text" class="text" style="width: 300px"> </div> - <div id="nfsServerChooseDiv" class="tmpl-html"> + <div id="nfsServerChooseDiv" class="field tmpl-html" style="overflow:visible"> <p class="text-help"> $_("Please choose the nfs server you want to create storage pool.")</p> - <div class="storage-type-wrapper-controls"> - <div class="btn-select dropdown popable"> - <span class="text" id="nfs-server-label"></span><span class="arrow"></span> - <div class="popover" style="width: 100%"> - <ul class="select-list" id="nfs-server-used" data-target="nfsServerSelect" data-label="nfs-server-label"> - </ul> + <div class="btn-select dropdown popable" style="width: 285px"> + <input id="nfsServerSelect" type="hidden"/> + <span class="text" id="nfs-server-label"></span><span class="arrow"></span> + <div class="popover" style="width: 100%"> + <ul class="select-list" id="nfs-server-used" data-target="nfsServerSelect" data-label="nfs-server-label"> + </ul> + </div> </div> </div> - </div> - </div> </section> <section class="form-section"> <h2>4. $_("NFS Path")</h2>
On 12/24/2013 05:44 PM, Rodrigo Trujillo wrote:
Does this patch depend on another patch ?? I was not able to apply and test it, even manually ... there are pieces missing.
I also can't apply the patch set to test. Maybe it needs a rebase
On 12/24/2013 12:21 AM, zhoumeina wrote:
This patch is working adding a select box in create nfs pool, when user don't want to input the server ip or name, he can simply select "used the server I have used before" and choose a server in a select box, this is more convinent. Signed-off-by: zhoumeina <zhoumein@linux.vnet.ibm.com> --- ui/css/theme-default/storage.css | 2 +- ui/js/src/kimchi.api.js | 2 +- ui/js/src/kimchi.storagepool_add_main.js | 32 ++++++++++++++++++----------- ui/pages/i18n.html.tmpl | 3 +- ui/pages/storagepool-add.html.tmpl | 17 +++++++-------- 5 files changed, 32 insertions(+), 24 deletions(-)
diff --git a/ui/css/theme-default/storage.css b/ui/css/theme-default/storage.css index 7bb685f..ae89f1b 100644 --- a/ui/css/theme-default/storage.css +++ b/ui/css/theme-default/storage.css @@ -548,7 +548,7 @@
.storage-type-wrapper-controls > .dropdown { margin: 5px 0 0 1px; - width: 100px; + width: 150px; }
.storage-type-wrapper-controls input[type="text"][disabled] { diff --git a/ui/js/src/kimchi.api.js b/ui/js/src/kimchi.api.js index 0461b30..3af1673 100644 --- a/ui/js/src/kimchi.api.js +++ b/ui/js/src/kimchi.api.js @@ -684,7 +684,7 @@ var kimchi = { },
getStorageServers: function(type, suc, err) { - var url = kimchi.url + 'storageservers?type=' + type; + var url = kimchi.url + 'storageservers?target_type=' + type; kimchi.requestJSON({ url : url, type : 'GET', diff --git a/ui/js/src/kimchi.storagepool_add_main.js b/ui/js/src/kimchi.storagepool_add_main.js index 42c6bf5..5cd5b15 100644 --- a/ui/js/src/kimchi.storagepool_add_main.js +++ b/ui/js/src/kimchi.storagepool_add_main.js @@ -52,6 +52,23 @@ kimchi.initStorageAddPage = function() { $('.host-partition').html(listHtml); } kimchi.select('storagePool-list', options); + kimchi.getStorageServers('netfs', function(data) { + console.log($("#nfsServerSelect").val()); + var serverContent = []; + serverContent.push({ + label : i18n['select_default'], + value : '' + }); + if (data.length > 0) { + $.each(data, function(index, value) { + serverContent.push({ + label : value, + value : value + }); + }); + } + kimchi.select('nfs-server-used', serverContent); + }); $('#poolType').change(function() { if ($(this).val() === 'dir') { $('.path-section').removeClass('tmpl-html'); @@ -74,20 +91,11 @@ kimchi.initStorageAddPage = function() { } else { $('#nfsServerInputDiv').addClass('tmpl-html'); $('#nfsServerChooseDiv').removeClass('tmpl-html'); - kimchi.getStorageServers('netfs', function(data) { - var serverContent = []; - if (data.length > 0) { - $.each(data, function(index, value) { - serverContent.push({ - label : data.value, - value : data.value - }); - }); - } - kimchi.select('nfs-server-used', serverContent); - }); } }); + $('#nfsServerSelect').change(function() { + $('#nfsserverId').val($(this).val()); + }); }); };
diff --git a/ui/pages/i18n.html.tmpl b/ui/pages/i18n.html.tmpl index c1fc3d1..45c301d 100644 --- a/ui/pages/i18n.html.tmpl +++ b/ui/pages/i18n.html.tmpl @@ -121,7 +121,8 @@ var i18n = { 'action_create': "$_("Create")", 'msg_warning': "$_("Warning")", 'msg.logicalpool.confirm.delete': "$_("It will format your disk and you will loose any data in" - " there, are you sure to continue? ")" + " there, are you sure to continue? ")", + 'select_default': "$_("Please choose")", }; </script> </body> diff --git a/ui/pages/storagepool-add.html.tmpl b/ui/pages/storagepool-add.html.tmpl index 9d16ae6..31af028 100644 --- a/ui/pages/storagepool-add.html.tmpl +++ b/ui/pages/storagepool-add.html.tmpl @@ -83,19 +83,18 @@ <input id="nfsserverId" type="text" class="text" style="width: 300px"> </div> - <div id="nfsServerChooseDiv" class="tmpl-html"> + <div id="nfsServerChooseDiv" class="field tmpl-html" style="overflow:visible"> <p class="text-help"> $_("Please choose the nfs server you want to create storage pool.")</p> - <div class="storage-type-wrapper-controls"> - <div class="btn-select dropdown popable"> - <span class="text" id="nfs-server-label"></span><span class="arrow"></span> - <div class="popover" style="width: 100%"> - <ul class="select-list" id="nfs-server-used" data-target="nfsServerSelect" data-label="nfs-server-label"> - </ul> + <div class="btn-select dropdown popable" style="width: 285px"> + <input id="nfsServerSelect" type="hidden"/> + <span class="text" id="nfs-server-label"></span><span class="arrow"></span> + <div class="popover" style="width: 100%"> + <ul class="select-list" id="nfs-server-used" data-target="nfsServerSelect" data-label="nfs-server-label"> + </ul> + </div> </div> </div> - </div> - </div> </section> <section class="form-section"> <h2>4. $_("NFS Path")</h2>
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
participants (3)
-
Aline Manera -
Rodrigo Trujillo -
zhoumeina