- Kimchi-devel - oVirt List Archives

[PATCH V7] Add nfs server and target UI in create storage pool
by zhoumeina 24 Jan '14

24 Jan '14

v6-v7 Fix """ in storagepool-add.html.tmpl v5-v6 Fix bug in IE10. Fix bug in Firefox 17. v4-v5 Change some html nits. V3-V4 add value in jquery widget. move all storage all page style to css files. v2-v3 Make nfs server inputbox to combobox Edit jquery widgets to fix some small nits in it. change some parameter according to the changes from back end. v1-v2 Fix some bug in this patch, make it working and retest 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. In order to show server target I did a select box in UI, but sometimes maybe the export path number is large. So I made a filter-select widget to make user easier to choose the export path he want. This is the first jquery widget. And let us make all common widget to jquery widget from now on. Signed-off-by: zhoumeina <zhoumein(a)linux.vnet.ibm.com> --- ui/css/theme-default/button.css | 28 ++++-- ui/css/theme-default/form.css | 6 ++ ui/css/theme-default/popover.css | 1 + ui/css/theme-default/storage.css | 29 ++++++- ui/js/Makefile.am | 4 +- ui/js/src/kimchi.api.js | 27 ++++++- ui/js/src/kimchi.popable.js | 2 +- ui/js/src/kimchi.storagepool_add_main.js | 65 +++++++++++--- ui/js/src/kimchi.utils.js | 11 +++ ui/js/widgets/combobox.js | 130 ++++++++++++++++++++++++++++ ui/js/widgets/filter-select.js | 139 ++++++++++++++++++++++++++++++ ui/js/widgets/select-menu.js | 86 ++++++++++++++++++ ui/pages/i18n.html.tmpl | 6 +- ui/pages/storagepool-add.html.tmpl | 59 +++++++------ 14 files changed, 538 insertions(+), 55 deletions(-) create mode 100644 ui/js/widgets/combobox.js create mode 100644 ui/js/widgets/filter-select.js create mode 100644 ui/js/widgets/select-menu.js diff --git a/ui/css/theme-default/button.css b/ui/css/theme-default/button.css index c7ed3f6..4d1a808 100644 --- a/ui/css/theme-default/button.css +++ b/ui/css/theme-default/button.css @@ -247,30 +247,38 @@ .btn-select { display: inline-block; position: relative; - height: 38px; + height: 30px; padding-right: 20px; - margin: 5px; vertical-align: top; -webkit-border-radius: 5px; -moz-border-radius: 5px; - border-radius: 5px; - background: #eee; - box-shadow: -1px -1px 1px #666, 1px 1px 1px #fff, 2px 2px 2px rgba(0, 0, 0, .15) inset; + background: #fff; + box-shadow: -1px -1px 1px #666, 1px 1px 1px #fff, 1px 1px 1px rgba(0, 0, 0, .15) inset; font-size: 13px; - line-height: 38px; + line-height: 30px; text-align: left; cursor: pointer; } -.btn-select .text { - padding: 0 10px; +.btn-select .input { + border: 0 solid #CCCCCC; + margin-right: 10px; + font-size: 16px; + height: 30px; + line-height: 30px; + width: 100%; + position: absolute; + padding: 0 5px; } +.btn-select input.invalid-field { + border: 1px solid #FF4444; +} .btn-select .arrow { position: absolute; width: 15px; - height: 38px; - line-height: 38px; + height: 30px; + line-height: 30px; top: 0; right: 5px; background: url(../images/theme-default/arrow-down-black.png) no-repeat center center; diff --git a/ui/css/theme-default/form.css b/ui/css/theme-default/form.css index 28e30a5..d1a3885 100644 --- a/ui/css/theme-default/form.css +++ b/ui/css/theme-default/form.css @@ -49,4 +49,10 @@ .form-section input.invalid-field[type="text"] { border-color: #FF4444; +} + +.text-help { + font-size: 12px; + color: #333; + margin: 0 0 5px 5px; } \ No newline at end of file diff --git a/ui/css/theme-default/popover.css b/ui/css/theme-default/popover.css index 95eb183..e91ccc0 100644 --- a/ui/css/theme-default/popover.css +++ b/ui/css/theme-default/popover.css @@ -31,6 +31,7 @@ left: 0; display: none; cursor: default; + width: 100%; } .popover:BEFORE { diff --git a/ui/css/theme-default/storage.css b/ui/css/theme-default/storage.css index d81dc75..62e1540 100644 --- a/ui/css/theme-default/storage.css +++ b/ui/css/theme-default/storage.css @@ -529,7 +529,7 @@ width: 300px; display: inline-block; vertical-align: top; - padding: 5px 5px 5px 20px; + padding: 5px 5px 5px 22px; } .storage-type-wrapper-controls input[type="text"] { @@ -548,11 +548,36 @@ .storage-type-wrapper-controls > .dropdown { margin: 5px 0 0 1px; - width: 250px; + width: 150px; } .storage-type-wrapper-controls input[type="text"][disabled] { color: #bbb; background-color: #fafafa; cursor: not-allowed; +} + +.storage-add-input-width { + width: 285px; +} + +.form-section .storage-field { + overflow: visible; +} + +.storage-base-input-width { + width: 300px; +} + +.storage-window { + width: 600px; + height: 700px; +} + +.storage-port-width { + width:40px; +} + +.storage-auth-width { + width: 150px; } \ No newline at end of file diff --git a/ui/js/Makefile.am b/ui/js/Makefile.am index 6808226..65254da 100644 --- a/ui/js/Makefile.am +++ b/ui/js/Makefile.am @@ -20,7 +20,7 @@ SUBDIRS = novnc -EXTRA_DIST = src +EXTRA_DIST = src widgets jsdir = $(datadir)/kimchi/ui/js @@ -31,7 +31,7 @@ dist_js_DATA = \ modernizr.custom.2.6.2.min.js \ $(NULL) -kimchi.min.js: src/*.js +kimchi.min.js: widgets/*.js src/*.js cat $(sort $^) > $@ CLEANFILES = kimchi.min.js diff --git a/ui/js/src/kimchi.api.js b/ui/js/src/kimchi.api.js index a4608ff..8d006d2 100644 --- a/ui/js/src/kimchi.api.js +++ b/ui/js/src/kimchi.api.js @@ -683,5 +683,30 @@ var kimchi = { success : suc, error : err }); + }, + + getStorageServers: function(type, suc, err) { + var url = kimchi.url + 'storageservers?target_type=' + type; + kimchi.requestJSON({ + url : url, + type : 'GET', + contentType : 'application/json', + dataType : 'json', + success : suc, + error : err + }); + }, + + getStorageTargets: function(server,type, suc, err) { + var url = kimchi.url + 'storageservers/' + server + '/storagetargets?target_type=' + type; + kimchi.requestJSON({ + url : url, + type : 'GET', + contentType : 'application/json', + timeout: 2000, + dataType : 'json', + success : suc, + error : err + }); } -}; +}; \ No newline at end of file diff --git a/ui/js/src/kimchi.popable.js b/ui/js/src/kimchi.popable.js index 153d32c..2a843be 100644 --- a/ui/js/src/kimchi.popable.js +++ b/ui/js/src/kimchi.popable.js @@ -25,7 +25,7 @@ kimchi.popable = function() { $(document).on("click", ".popable", function(e) { var isOpen = $(this).hasClass('open'); $(".popable").removeClass('open'); - if (!isOpen) { + if (!isOpen && $(this).find('ul').html() !== '') { $(this).addClass('open'); } diff --git a/ui/js/src/kimchi.storagepool_add_main.js b/ui/js/src/kimchi.storagepool_add_main.js index 24de979..a4d4648 100644 --- a/ui/js/src/kimchi.storagepool_add_main.js +++ b/ui/js/src/kimchi.storagepool_add_main.js @@ -23,12 +23,13 @@ kimchi.storagepool_add_main = function() { kimchi.initStorageAddPage(); $('#form-pool-add').on('submit', kimchi.addPool); - $('#form-nfs-pool-add').on('submit', kimchi.addnfsPool); $('#pool-doAdd').on('click', kimchi.addPool); - $('#pool-nfs-doAdd').on('click', kimchi.addnfsPool); }; kimchi.initStorageAddPage = function() { + $('#poolTypeId').selectMenu(); + $('#serverComboboxId').combobox(); + $('#targetFilterSelectId').filterselect(); var options = [ { label : "DIR", value : "dir" @@ -54,8 +55,53 @@ kimchi.initStorageAddPage = function() { }); $('.host-partition').html(listHtml); } - kimchi.select('storagePool-list', options); - $('#poolType').change(function() { + $('#poolTypeId').selectMenu("setData", options); + kimchi.getStorageServers('netfs', function(data) { + var serverContent = []; + if (data.length > 0) { + $.each(data, function(index, value) { + serverContent.push({ + label : value.addr, + value : value.addr + }); + }); + } + $('#serverComboboxId').combobox("setData", serverContent); + $('input[name=nfsServerType]').change(function() { + if ($(this).val() === 'input') { + $('#nfsServerInputDiv').removeClass('tmpl-html'); + $('#nfsServerChooseDiv').addClass('tmpl-html'); + } else { + $('#nfsServerInputDiv').addClass('tmpl-html'); + $('#nfsServerChooseDiv').removeClass('tmpl-html'); + } + }); + $('#nfsserverId').on("change",function() { + if ($(this).val() !== '' && kimchi.isServer($(this).val())) { + $('#nfspathId').prop('disabled',false); + $(this).removeClass("invalid-field"); + } else { + $(this).addClass("invalid-field"); + $('#nfspathId').prop( "disabled",true); + } + $('#targetFilterSelectId').filterselect('clear'); + }); + $('#nfspathId').focus(function() { + var targetContent = []; + kimchi.getStorageTargets($('#nfsserverId').val(), 'netfs', function(data) { + if (data.length > 0) { + $.each(data, function(index, value) { + targetContent.push({ + label : value.target, + value : value.target + }); + }); + } + $('#targetFilterSelectId').filterselect("setData", targetContent); + }); + }); + }); + $('#poolTypeInputId').change(function() { if ($(this).val() === 'dir') { $('.path-section').removeClass('tmpl-html'); $('.logical-section').addClass('tmpl-html'); @@ -93,7 +139,7 @@ kimchi.initStorageAddPage = function() { kimchi.validateForm = function() { var name = $('#poolId').val(); - var poolType = $("#poolType").val(); + var poolType = $("#poolTypeInputId").val(); if ('' === name) { kimchi.message.error(i18n['msg.pool.edit.name.blank']); return false; @@ -111,7 +157,6 @@ kimchi.validateForm = function() { } else { return kimchi.validateLogicalForm(); } - }; kimchi.validateDirForm = function () { @@ -162,11 +207,7 @@ kimchi.validateServer = function(serverField) { kimchi.message.error(i18n['msg.pool.edit.server.blank']); return false; } - var domain = "([0-9a-z_!~*'()-]+\.)*([0-9a-z][0-9a-z-]{0,61})?[0-9a-z]\.[a-z]{2,6}" - var ip = "(\\d{1,3}\.){3}\\d{1,3}" - regex = new RegExp('^' + domain + '|' + ip + '$') - - if (!regex.test(serverField)) { + if(!kimchi.isServer(serverField)) { kimchi.message.error(i18n['msg.validate.pool.edit.server']); return false; } @@ -186,7 +227,7 @@ kimchi.addPool = function(event) { if (kimchi.validateForm()) { var formData = $('#form-pool-add').serializeObject(); delete formData.authname; - var poolType = $("#poolType").val(); + var poolType = $('#poolTypeId').selectMenu('value'); if (poolType === 'dir') { formData.path = $('#pathId').val(); } else if (poolType === 'logical') { diff --git a/ui/js/src/kimchi.utils.js b/ui/js/src/kimchi.utils.js index a23bf51..3cf36b9 100644 --- a/ui/js/src/kimchi.utils.js +++ b/ui/js/src/kimchi.utils.js @@ -168,3 +168,14 @@ kimchi.isUnsignedNumeric = function(number) { var reg = /^d+(.d+)?$/ return reg.test(number); } + +kimchi.isServer = function(server) { + var domain = "([0-9a-z_!~*'()-]+\.)*([0-9a-z][0-9a-z-]{0,61})?[0-9a-z]\.[a-z]{2,6}"; + var ip = "(\\d{1,3}\.){3}\\d{1,3}"; + regex = new RegExp('^' + domain + '|' + ip + '$'); + if (!regex.test(server)) { + return false; + } else { + return true; + } +}; diff --git a/ui/js/widgets/combobox.js b/ui/js/widgets/combobox.js new file mode 100644 index 0000000..2782f62 --- /dev/null +++ b/ui/js/widgets/combobox.js @@ -0,0 +1,130 @@ +/* + * Project Kimchi + * + * Copyright IBM, Corp. 2013 + * + * Authors: + * zhoumeina <zhoumein(a)linux.vnet.ibm.com> + * + * Licensed under the Apache License, Version 2.0 (the 'License'); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an 'AS IS' BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +(function($) { + $.widget('kimchi.combobox', { + _create : function() { + this.selectDiv = this.element; + this.listControl = this.selectDiv.find('ul').first(); + this.listControl.html(''); + this.target = this.selectDiv.find('input').first(); + this.selectDiv.addClass('btn-select dropdown popable'); + this.target.addClass('input'); + this.target.width(this.selectDiv.width()+10); + this.listControl.addClass('select-list'); + this.listControl.parent().addClass('popover'); + }, + + setData : function(options) { + var that = this; + var value = this.target.val(); + var selectedClass = 'active'; + var itemTag = 'li'; + if (options.length > 0) { + that.target.after($('<span class="arrow"></span>')); + that.listControl.on('click', itemTag, function(e) { + that.listControl.children().removeClass(selectedClass); + $(this).addClass(selectedClass); + var oldValue = that.target.val(); + var newValue = $(this).data('value'); + that.target.val(newValue); + if (oldValue !== newValue) { + that.target.change(); + } + }); + + that.selectDiv.click(function(e) { + that.listControl.html(''); + var items = that._dataList(options); + $.each(items, function(index, item) { + that.listControl.append(item); + }) + }); + + that.target.keyup(function(event) { + that.listControl.html(''); + var items = that._dataList(options); + var temp = 0; + $.each(items, function(index, item) { + if (item.text().indexOf(that.target.val()) == 0) { + that.listControl.append(item); + temp++; + } + }); + if (temp > 0 && that.listControl.html() !== '') { + that._open(); + } else { + that._close(); + } + }); + } + }, + + value : function(value) { + if (value === undefined) { + return this.target.val(); + } + this.target.val(value); + }, + + _dataList : function(options) { + var item; + var itemTag = 'li'; + var selectedClass = 'active'; + var items = []; + var that = this; + $.each(options, function(index, option) { + item = $('<' + itemTag + '>' + option.label +'</' + itemTag + '>'); + item.data('value', option.value); + if (option.value === that.target.val()) { + item.addClass(selectedClass); + } + items.push(item); + }); + return items; + }, + + clear : function() { + this.target.val(""); + }, + + _open : function() { + var isOpen = this.selectDiv.hasClass('open'); + if (!isOpen) { + this.selectDiv.addClass('open'); + } + }, + + _close : function() { + var isOpen = this.selectDiv.hasClass('open'); + if (isOpen) { + this.selectDiv.removeClass('open'); + } + }, + + destroy : function() { + this.selectDiv.removeClass('btn-select dropdown popable'); + this.target.removeClass('input'); + this.listControl.removeClass('select-list'); + this.listControl.parent().removeClass('popover'); + $.Widget.prototype.destroy.call(this); + } + }); +}(jQuery)); \ No newline at end of file diff --git a/ui/js/widgets/filter-select.js b/ui/js/widgets/filter-select.js new file mode 100644 index 0000000..44030a1 --- /dev/null +++ b/ui/js/widgets/filter-select.js @@ -0,0 +1,139 @@ +/* + * Project Kimchi + * + * Copyright IBM, Corp. 2013 + * + * Authors: + * zhoumeina <zhoumein(a)linux.vnet.ibm.com> + * + * Licensed under the Apache License, Version 2.0 (the 'License'); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an 'AS IS' BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +(function($) { + $.widget('kimchi.filterselect', { + _create : function() { + this.selectDiv = this.element; + this.listControl = this.selectDiv.find('ul').first(); + this.listControl.html(''); + this.target = this.selectDiv.find('input').first(); + this.selectDiv.addClass('btn-select dropdown popable'); + this.target.addClass('input'); + this.target.width(this.selectDiv.width()+10); + this.listControl.addClass('select-list'); + this.listControl.parent().addClass('popover'); + }, + + setData : function(options) { + var that = this; + var value = this.target.val(); + var selectedClass = 'active'; + var itemTag = 'li'; + if (options.length > 0) { + that.target.after($('<span class="arrow"></span>')); + that.listControl.on('click', itemTag, function(e) { + that.listControl.children().removeClass(selectedClass); + $(this).addClass(selectedClass); + var oldValue = that.target.val(); + var newValue = $(this).data('value'); + that.target.val(newValue); + if (oldValue !== newValue) { + that.target.change(); + that.target.removeClass("invalid-field"); + } + }); + + that.selectDiv.click(function(e) { + that.listControl.html(''); + var items = that._dataList(options); + if (items.length === 0) { + that.listControl.html(i18n['msg.no.mapping.result']); + } else { + $.each(items, function(index, item) { + that.listControl.append(item); + }); + } + }); + + that.target.keyup(function(event) { + that.listControl.html(''); + var items = that._dataList(options); + var temp = 0; + $.each(items, function(index, item) { + if (item.text().indexOf(that.target.val()) == 0) { + that.listControl.append(item); + temp++; + } + }); + if (that.listControl.html() === '') { + that.target.addClass("invalid-field"); + that.listControl.html(i18n['msg.no.mapping.result']); + } else { + that.target.removeClass("invalid-field"); + } + if (temp > 0) { + that._open(); + } + }); + } + }, + + value : function(value) { + if (value === undefined) { + return this.target.val(); + } + this.target.val(value); + }, + + _dataList : function(options) { + var item; + var itemTag = 'li'; + var selectedClass = 'active'; + var items = []; + var that = this; + $.each(options, function(index, option) { + item = $('<' + itemTag + '>' + option.label +'</' + itemTag + '>'); + item.data('value', option.value); + if (option.value === that.target.val()) { + item.addClass(selectedClass); + } + items.push(item); + }); + return items; + }, + + clear : function() { + this.target.val(""); + }, + + _open : function() { + var isOpen = this.selectDiv.hasClass('open'); + if (!isOpen) { + this.selectDiv.addClass('open'); + } + }, + + _close : function() { + var isOpen = this.selectDiv.hasClass('open'); + if (isOpen) { + this.selectDiv.removeClass('open'); + } + }, + + destroy : function() { + this.selectDiv.removeClass('btn-select dropdown popable'); + this.target.removeClass('input'); + this.listControl.removeClass('select-list'); + this.listControl.parent().removeClass('popover') + $.Widget.prototype.destroy.call(this); + } + }); +}(jQuery)); \ No newline at end of file diff --git a/ui/js/widgets/select-menu.js b/ui/js/widgets/select-menu.js new file mode 100644 index 0000000..c9a1b87 --- /dev/null +++ b/ui/js/widgets/select-menu.js @@ -0,0 +1,86 @@ +/* + * Project Kimchi + * + * Copyright IBM, Corp. 2013 + * + * Authors: + * zhoumeina <zhoumein(a)linux.vnet.ibm.com> + * + * Licensed under the Apache License, Version 2.0 (the 'License'); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an 'AS IS' BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +(function($) { + $.widget('kimchi.selectMenu', { + + _create : function() { + this.selectDiv = this.element; + this.listControl = this.selectDiv.find('ul').first(); + this.listControl.html(''); + this.target = this.selectDiv.find('input').first(); + this.label = this.selectDiv.find('span').first(); + this.selectDiv.addClass('btn-select dropdown popable'); + this.target.addClass('input'); + this.label.addClass('input'); + this.listControl.addClass('select-list'); + this.listControl.parent().addClass('popover'); + }, + + setData : function (options) { + var that = this; + var value = this.target.val(); + var selectedClass = 'active'; + var itemTag = 'li'; + var item; + if (options.length > 0) { + $.each(options, function(index, option) { + item = $('<' + itemTag + '>' + option.label +'</' + itemTag + '>'); + item.data('value', option.value); + if(option.value === value) { + item.addClass(selectedClass); + that.label.text(option.label); + } + that.listControl.append(item); + }); + that.listControl.on('click', itemTag, function() { + that.listControl.children().removeClass(selectedClass); + $(this).addClass(selectedClass); + that.label.text($(this).text()); + var oldValue = that.target.val(); + var newValue = $(this).data('value'); + that.target.val(newValue); + if(oldValue !== newValue) { + that.target.change(); + } + }); + } else { + kimchi.message.error(i18n['selectmenu.data.error']); + } + }, + + value : function(data) { + if (data === undefined) { + return this.target.val(); + } + this.target.val(data.value); + this.label.val(data.label); + }, + + destroy : function() { + this.selectDiv.removeClass('btn-select dropdown popable'); + this.target.removeClass('input'); + this.label.removeClass('input'); + this.listControl.removeClass('select-list'); + this.listControl.parent().removeClass('popover'); + $.Widget.prototype.destroy.call(this); + } + }); +}(jQuery)); \ No newline at end of file diff --git a/ui/pages/i18n.html.tmpl b/ui/pages/i18n.html.tmpl index 603f8d7..37b4114 100644 --- a/ui/pages/i18n.html.tmpl +++ b/ui/pages/i18n.html.tmpl @@ -122,7 +122,11 @@ var i18n = { " there, are you sure to continue? ")", 'msg.pool.edit.iscsitarget.blank': "$_("The iSCSI target can not be blank.")", 'msg.pool.edit.server.blank':"$_("Server name can not be blank.")", - 'msg.validate.pool.edit.server':"$_("This is not a valid Server Name or IP. please, modify it.")" + 'msg.validate.pool.edit.server':"$_("This is not a valid Server Name or IP. please, modify it.")", + 'select_default': "$_("Please choose")", + 'msg.no.mapping.result': "$_("No such data exsit.")", + 'msg.no.result' : "$_("No valid result")", + 'selectmenu.data.error' : "$_("options needed.")" }; </script> </body> diff --git a/ui/pages/storagepool-add.html.tmpl b/ui/pages/storagepool-add.html.tmpl index e8dac43..363d097 100644 --- a/ui/pages/storagepool-add.html.tmpl +++ b/ui/pages/storagepool-add.html.tmpl @@ -27,7 +27,7 @@ <!DOCTYPE html> <html> <body> - <div class="window" style="width: 600px; height: 700px;"> + <div class="window storage-window"> <header> <h1 class="title">$_("Define a New Storage Pool")</h1> <div class="close">X</div> @@ -40,18 +40,17 @@ <p class="text-help"> $_("The name used to identify the storage pools, and it should not be empty.") </p> - <input id="poolId" required="required" type="text" class="text" style="width: 300px" - name="name"> + <input id="poolId" required="required" type="text" class="text storage-base-input-width" name="name"> </div> </section> <section class="form-section"> <h2>2. $_("Storage Pool Type")</h2> <div class="storage-type-wrapper-controls"> - <div class="btn dropdown popable"> - <input id="poolType" name="type" type="hidden" value="dir"/> - <span class="text" id="pool-type-label"></span><span class="arrow"></span> - <div class="popover" style="width: 100%"> - <ul class="select-list" id="storagePool-list" data-target="poolType" data-label="pool-type-label"> + <div id="poolTypeId"> + <input id="poolTypeInputId" name="type" type="hidden" value="dir"/> + <span id="pool-type-label"></span><span class="arrow"></span> + <div> + <ul id="storagePool-list"> </ul> </div> </div> @@ -65,30 +64,38 @@ $_("The path of the Storage Pool. Each Storage Pool must have a unique path.")</p> <p class="text-help"> $_("Kimchi will try to create the directory when it does not already exist in your system.")</p> - <input id="pathId" type="text" class="text" required="required" style="width: 300px"> + <input id="pathId" type="text" class="text storage-base-input-width"> </div> <div class="clear"></div> </section> </div> <div class="nfs-section tmpl-html"> <section class="form-section"> - <h2>3. $_("NFS server IP")</h2> - <div class="field"> + <h2>3. $_("NFS Server IP")</h2> + <div class="field storage-field"> <p class="text-help"> - $_("NFS server IP or hostname. It should not be empty.")</p> - <input id="nfsserverId" required="required" type="text" class="text" - style="width: 300px"> + $_("NFS server IP or hostname. It can be input or chosen from history.")</p> + <div id="serverComboboxId" class="storage-add-input-width"> + <input id="nfsserverId"/> + <div> + <ul id="nfs-server-used"> + </ul> + </div> + </div> </div> </section> <section class="form-section"> <h2>4. $_("NFS Path")</h2> - <div class="field"> - <p class="text-help">$_("The nfs exported path on nfs server")</p> - <input id="nfspathId" required="required" type="text" class="text" - style="width: 300px"> - <input type="hidden" id="localpathId" class="text" value="none"> - </div> - <div class="clear"></div> + <div class="field storage-field"> + <p class="text-help">$_("The nfs exported path on nfs server.")</p> + <div id="targetFilterSelectId" class="storage-add-input-width"> + <input id="nfspathId" class="input" disabled/> + <div> + <ul id="nfs-server-target"> + </ul> + </div> + </div> + </div> </section> </div> <div class="logical-section tmpl-html"> @@ -103,15 +110,15 @@ <div class="field"> <p class="text-help"> $_("iSCSI server IP or hostname. It should not be empty.")</p> - <input id="iscsiserverId" placeholder="$_("Server")" type="text" class="text" style="width: 300px"> - <input id="iscsiportId" placeholder="$_("Port")" type="text" class="text" style="width:40px" maxlength='4'> + <input id="iscsiserverId" placeholder="$_("Server")" type="text" class="text storage-base-input-width"> + <input id="iscsiportId" placeholder="$_("Port")" type="text" class="text storage-port-width" maxlength="4"> </div> </section> <section class="form-section"> <h2>4. $_("Target")</h2> <div class="field"> <p class="text-help">$_("The iSCSI target on iSCSI server")</p> - <input id="iscsiTargetId" type="text" class="text" style="width: 300px"> + <input id="iscsiTargetId" type="text" class="text storage-base-input-width"> </div> </section> <section class="form-section"> @@ -123,8 +130,8 @@ <section class="authenticationfield form-section tmpl-html"> <h2>5. $_("iSCSI Authentication")</h2> <div class="field"> - <input id="usernameId" placeholder="$_("User Name")" type="text" class="text" style="width: 150px"> - <input id="passwordId" placeholder="$_("Password")" type="text" class="text" style="width: 150px"> + <input id="usernameId" placeholder="$_("User Name")" type="text" class="text storage-auth-width"> + <input id="passwordId" placeholder="$_("Password")" type="text" class="text storage-auth-width"> </div> </section> </div> -- 1.7.1

4 7

[PATCH V4 0/4] improve controller
by shaohef＠linux.vnet.ibm.com 24 Jan '14

24 Jan '14

From: ShaoHe Feng <shaohef(a)linux.vnet.ibm.com> V3 -> V4 rebase fix typo move the improvement function from src/kimchi/utils.py to src/kimchi/control/utils.py V2 -> V3 use the CapWords convention to name class name. add the import statement in alphabetical order use __import__ to import the moudle instead of imp.load_module imp.load_module does more than importing the module: if the module was already imported, it is equivalent to a reload()! we can use the imp.load_module as follow: try: module = sys.modules[module_name] except KeyError: mod_fobj, mod_absp, mod_desc = imp.find_module(mod_name, [path]) module = imp.load_module(module_name, mod_fobj, mod_absp, mod_desc) V1 -> V2 fix typo. remove print use url_auth instead of _url_sub_node_auth improve the commit description add a method to load root sub collections/resouces automatically ShaoHe Feng (4): improve controller: add a method to load root sub collections/resouces automatically improve controller: tag the collections/resouces of root with @UrlSubNode improve controller: Root loads collections/resouces automatically improve controller: set authentication automatically src/kimchi/control/__init__.py | 8 ++++++++ src/kimchi/control/config.py | 2 ++ src/kimchi/control/debugreports.py | 2 ++ src/kimchi/control/host.py | 2 ++ src/kimchi/control/interfaces.py | 2 ++ src/kimchi/control/networks.py | 2 ++ src/kimchi/control/plugins.py | 2 ++ src/kimchi/control/storagepools.py | 2 ++ src/kimchi/control/tasks.py | 2 ++ src/kimchi/control/templates.py | 2 ++ src/kimchi/control/utils.py | 39 ++++++++++++++++++++++++++++++++++++++ src/kimchi/control/vms.py | 3 ++- src/kimchi/root.py | 28 +++++---------------------- src/kimchi/server.py | 12 +++++------- 14 files changed, 77 insertions(+), 31 deletions(-) -- 1.8.4.2

2 6

[PATCH V3 0/4] improve controller
by shaohef＠linux.vnet.ibm.com 24 Jan '14

24 Jan '14

From: ShaoHe Feng <shaohef(a)linux.vnet.ibm.com> V2 -> V3 use the CapWords convention to name class name. add the import statement in alphabetical order use __import__ to import the moudle instead of imp.load_module imp.load_module does more than importing the module: if the module was already imported, it is equivalent to a reload()! we can use the imp.load_module as follow: try: module = sys.modules[module_name] except KeyError: mod_fobj, mod_absp, mod_desc = imp.find_module(mod_name, [path]) module = imp.load_module(module_name, mod_fobj, mod_absp, mod_desc) V1 -> V2 fix typo. remove print use url_auth instead of _url_sub_node_auth improve the commit description add a method to load root sub collections/resouces automatically ShaoHe Feng (4): improve controller: add a method to load root sub collections/resouces automatically improve controller: tag the collections/resouces of root with @UrlSubNode improve controller: Root loads collections/resouces automatically improve controller: set authentication automatically src/kimchi/control/__init__.py | 8 ++++++++ src/kimchi/control/config.py | 2 ++ src/kimchi/control/debugreports.py | 2 ++ src/kimchi/control/host.py | 2 ++ src/kimchi/control/interfaces.py | 2 ++ src/kimchi/control/networks.py | 2 ++ src/kimchi/control/plugins.py | 2 ++ src/kimchi/control/storagepools.py | 2 ++ src/kimchi/control/tasks.py | 2 ++ src/kimchi/control/templates.py | 2 ++ src/kimchi/control/vms.py | 2 ++ src/kimchi/root.py | 26 +++++--------------------- src/kimchi/server.py | 12 +++++------- src/kimchi/utils.py | 38 ++++++++++++++++++++++++++++++++++++++ 14 files changed, 76 insertions(+), 28 deletions(-) -- 1.8.4.2

3 11

[RFC]: help, how to get the mac after create a VM interface.
by Sheldon 23 Jan '14

23 Jan '14

when I create a interface, There is no mac attribute in the xml. After create successfully, libvirt will allocate a mac. The problem is that, How can I get the mac. Should the CREATE method always needs to return an interface info? Here is some of create code. def vmifaces_create(self, vm, params): dom = self._get_vm(vm) xml = """ <interface type='network'> <source network='default'/> </interface> """ dom.attachDeviceFlags(xml, libvirt.VIR_DOMAIN_AFFECT_CURRENT) # here I need to return the mac return ???? The libvirt will create a xml like the follow? The problem is that the a vm may have several interfaces. xml = """ <interface type='network'> <mac address='52:54:00:2a:53:8f'/> <source network='default'/> <model type='rtl8139'/> <address type='pci' domain='0x0000' bus='0x00' slot='0x03' function='0x0'/> </interface> """ -- Thanks and best regards! Sheldon Feng(冯少合)<shaohef(a)linux.vnet.ibm.com> IBM Linux Technology Center

5 10

[PATCH] add gettext to package require list
by shaohef＠linux.vnet.ibm.com 23 Jan '14

23 Jan '14

From: ShaoHe Feng <shaohef(a)linux.vnet.ibm.com> gettext translates a natural language message into the user's language. kimchi needs it. Signed-off-by: ShaoHe Feng <shaohef(a)linux.vnet.ibm.com> Signed-off-by: Zhou Zheng Sheng <zhshzhou(a)linux.vnet.ibm.com> --- contrib/DEBIAN/control.in | 1 + contrib/kimchi.spec.fedora.in | 1 + contrib/kimchi.spec.suse.in | 1 + 3 files changed, 3 insertions(+) diff --git a/contrib/DEBIAN/control.in b/contrib/DEBIAN/control.in index 1ddc5ba..762b3a0 100644 --- a/contrib/DEBIAN/control.in +++ b/contrib/DEBIAN/control.in @@ -8,6 +8,7 @@ Depends: python-cherrypy3 (>= 3.2.0), python-imaging, python-jsonschema (>= 1.3.0), python-libvirt, + gettext, libvirt-bin, nfs-common, python-m2crypto, diff --git a/contrib/kimchi.spec.fedora.in b/contrib/kimchi.spec.fedora.in index 77c64e9..4505d9d 100644 --- a/contrib/kimchi.spec.fedora.in +++ b/contrib/kimchi.spec.fedora.in @@ -11,6 +11,7 @@ Group: System Environment/Base License: LGPL/ASL2 Source0: %{name}-%{version}.tar.gz Requires: qemu-kvm +Requires: gettext-devel Requires: libvirt Requires: libvirt-python Requires: python-cherrypy >= 3.2.0 diff --git a/contrib/kimchi.spec.suse.in b/contrib/kimchi.spec.suse.in index 889b704..a178442 100644 --- a/contrib/kimchi.spec.suse.in +++ b/contrib/kimchi.spec.suse.in @@ -7,6 +7,7 @@ Group: System Environment/Base License: LGPL/ASL2 Source0: %{name}-%{version}.tar.gz Requires: kvm +Requires: gettext-tools Requires: libvirt Requires: libvirt-python Requires: python-CherryPy >= 3.2.0 -- 1.8.4.2

2 2

[PATCH] bug fix: test case can not find plugin, fix it
by shaohef＠linux.vnet.ibm.com 23 Jan '14

23 Jan '14

From: ShaoHe Feng <shaohef(a)linux.vnet.ibm.com> $ sudo ./run_tests.sh test_rest Failed to import plugin plugins.sample.Drawings That's because plugin is not in src/ Signed-off-by: ShaoHe Feng <shaohef(a)linux.vnet.ibm.com> --- tests/run_tests.sh.in | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/tests/run_tests.sh.in b/tests/run_tests.sh.in index 2baf66d..038e8fa 100644 --- a/tests/run_tests.sh.in +++ b/tests/run_tests.sh.in @@ -31,7 +31,7 @@ else fi if [ "$HAVE_UNITTEST" != "yes" -o "$PYTHON_VER" == "2.6" ]; then - PYTHONPATH=../src:./ unit2 $ARGS + PYTHONPATH=../src:./:../ unit2 $ARGS else - PYTHONPATH=../src python -m unittest $ARGS + PYTHONPATH=../src:../ python -m unittest $ARGS fi -- 1.8.4.2

4 3

[PATCH] Modify bug in spice UI
by zhoumeina 23 Jan '14

23 Jan '14

Last spice patch push hard code in spice UI, this patch is working for fix this issue. Signed-off-by: zhoumeina <zhoumein(a)linux.vnet.ibm.com> --- ui/pages/spice.html.tmpl | 2 +- 1 files changed, 1 insertions(+), 1 deletions(-) diff --git a/ui/pages/spice.html.tmpl b/ui/pages/spice.html.tmpl index 7fd0db5..3e43306 100644 --- a/ui/pages/spice.html.tmpl +++ b/ui/pages/spice.html.tmpl @@ -74,7 +74,7 @@ sc.stop(); } - uri = scheme + host + ":" + port + "/?token=rrr"; + uri = scheme + host + ":" + port + "/?token=" + token; try { sc = new SpiceMainConn({ uri : uri, -- 1.7.1

5 4

[PATCHv9 00/10] Support storage targets and servers
by lvroyce＠linux.vnet.ibm.com 23 Jan '14

23 Jan '14

From: Royce Lv <lvroyce(a)linux.vnet.ibm.com> v9>v10, work around ubuntu libvirt problem. v8>v9, split two types of filter params, fix nits v7>v8, address model break, change xml construction to libxml v6>v7, adopt lxml to parse xml, move parse params to get() to avoid duplicate code, fix bugs when one server support multiple target type. v5>v6, change GET param support to cover more scenario of filter collected results. v4>v5, remove storage server list reload function, merge storage server and targets v3>v4, fix inconsistency between doc and json schema v1>v3, fix racing problem, fix style. Royce Lv (10): Support params for GET method Add testcase for GET param Storage server: Update API.md storage server: update controller.py storage server: Update model and mockmodel storage target: Update API.md storage target: Update controller and json schema storage target: Add model support Add showmount function and feature test for libvirt target probe Fix libvirt nfs target probe problem docs/API.md | 37 ++++++++++++++++ src/kimchi/API.json | 22 ++++++++++ src/kimchi/control/base.py | 31 +++++++++++--- src/kimchi/control/storagepools.py | 4 +- src/kimchi/control/storageservers.py | 55 ++++++++++++++++++++++++ src/kimchi/control/storagevolumes.py | 2 +- src/kimchi/featuretests.py | 22 ++++++++++ src/kimchi/mockmodel.py | 30 +++++++++++++ src/kimchi/model.py | 82 +++++++++++++++++++++++++++++++++++- src/kimchi/root.py | 2 + src/kimchi/utils.py | 20 ++++++++- tests/test_rest.py | 23 ++++++++++ 12 files changed, 317 insertions(+), 13 deletions(-) create mode 100644 src/kimchi/control/storageservers.py -- 1.8.1.2

3 22

[PATCH V2]Avoid useless libvirt error log produced by featuret
by apporc 23 Jan '14

23 Jan '14

v2-v1: 1. Just hide the portocol type error, leave other error messages as it is.(Thanks Cristian) 2. Unregister the error handler when necessary.(Thanks Cristian) 3. Keep back kimchi log "*** Running feature tests ***", etc.(Thanks Cristian) 4. Move libvirt error handler function inside of Featuretest.(Thanks Aline) v1: Avoid useless libvirt error log produced by featuret apporc (1): Avoid useless libvirt error log produced by featuretests src/kimchi/featuretests.py | 14 ++++++++++++-- src/kimchi/model.py | 2 -- 2 files changed, 12 insertions(+), 4 deletions(-) -- 1.7.9.5

2 2

[PATCH] Break the 'sample' plugin's monolithic model into several smaller ones
by Zhou Zheng Sheng 23 Jan '14

23 Jan '14

In kimchi the model is always a monolithic class. This is not good from the point of modulization, and it is not necessary to put everything into one big model. Unfortunately the problem will not get solved unless we conduct enormous refactor against the whole controller-model architecture. This patch tries to mitigate the problem by firstly splitting the model class into some smaller ones, than automatically mapping all sub-model instance methods to a RootModel instance. As a demonstration, this patch splits the 'sample' plugin's model. Signed-off-by: Zhou Zheng Sheng <zhshzhou(a)linux.vnet.ibm.com> --- plugins/__init__.py | 47 +++++++++++++++++++++ plugins/sample/model.py | 109 ++++++++++++++++++++++++++++++------------------ 2 files changed, 115 insertions(+), 41 deletions(-) diff --git a/plugins/__init__.py b/plugins/__init__.py index e69de29..f0b800c 100644 --- a/plugins/__init__.py +++ b/plugins/__init__.py @@ -0,0 +1,47 @@ +# +# Project Kimchi +# +# Copyright IBM, Corp. 2014 +# +# Authors: +# Zhou Zheng Sheng <zhshzhou(a)linux.vnet.ibm.com> +# +# This library is free software; you can redistribute it and/or +# modify it under the terms of the GNU Lesser General Public +# License as published by the Free Software Foundation; either +# version 2.1 of the License, or (at your option) any later version. +# +# This library is distributed in the hope that it will be useful, +# but WITHOUT ANY WARRANTY; without even the implied warranty of +# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU +# Lesser General Public License for more details. +# +# You should have received a copy of the GNU Lesser General Public +# License along with this library; if not, write to the Free Software +# Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA + + +class RootModel(object): + ''' + This model squashes all sub-model's public callable methods to itself. + + Model methods are not limited to get_list, create, lookup, update, delete. + Controller can call generate_action_handler to generate new actions, which + call the related model methods. So all public callable methods of a + sub-model should be mapped to this model. + ''' + def __init__(self, model_instances): + for model_instance in model_instances: + cls_name = model_instance.__class__.__name__ + if cls_name.endswith('Model'): + method_prefix = cls_name[:-len('Model')].lower() + else: + method_prefix = cls_name.lower() + + callables = [m for m in dir(model_instance) + if not m.startswith('_') and + callable(getattr(model_instance, m))] + + for member_name in callables: + m = getattr(model_instance, member_name, None) + setattr(self, '%s_%s' % (method_prefix, member_name), m) diff --git a/plugins/sample/model.py b/plugins/sample/model.py index 9a2f22f..d194e67 100644 --- a/plugins/sample/model.py +++ b/plugins/sample/model.py @@ -21,79 +21,106 @@ # Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA from kimchi.exception import InvalidOperation, NotFoundError +from kimchi.plugins import RootModel -class Model(object): +class CirclesModel(object): + def __init__(self): + self._circles = {} + + def create(self, params): + name = params['name'] + if name in self._circles: + raise InvalidOperation("Circle %s already exists" % name) + self._circles[name] = Circle(params['radius']) + return name + def get_list(self): + return sorted(self._circles) + + +class CircleModel(object): + def __init__(self, parent_model): + # Circel and Circles models are friends, it's OK to share _circles. + self._circles = parent_model._circles + + def lookup(self, name): + try: + circle = self._circles[name] + except KeyError: + raise NotFoundError("Circle %s not found" % name) + return {'radius': circle.radius} + + def update(self, name, params): + if name not in self._circles: + raise NotFoundError("Circle %s not found" % name) + self._circles[name].radius = params['radius'] + return name + + def delete(self, name): + try: + del self._circles[name] + except KeyError: + pass + + +class RectanglesModel(object): def __init__(self): - self.rectangles = {} - self.circles = {} + self._rectangles = {} - def rectangles_create(self, params): + def create(self, params): name = params['name'] - if name in self.rectangles: + if name in self._rectangles: raise InvalidOperation("Rectangle %s already exists" % name) - self.rectangles[name] = Rectangle(params['length'], params['width']) + self._rectangles[name] = Rectangle(params['length'], params['width']) return name - def rectangles_get_list(self): - return sorted(self.rectangles) + def get_list(self): + return sorted(self._rectangles) + - def rectangle_lookup(self, name): +class RectangleModel(object): + def __init__(self, parent_model): + self._rectangles = parent_model._rectangles + + def lookup(self, name): try: - rectangle = self.rectangles[name] + rectangle = self._rectangles[name] except KeyError: raise NotFoundError("Rectangle %s not found" % name) return {'length': rectangle.length, 'width': rectangle.width} - def rectangle_update(self, name, params): - if name not in self.rectangles: + def update(self, name, params): + if name not in self._rectangles: raise NotFoundError("Rectangle %s not found" % name) try: - self.rectangles[name].length = params['length'] + self._rectangles[name].length = params['length'] except KeyError: pass try: - self.rectangles[name].width = params['width'] + self._rectangles[name].width = params['width'] except KeyError: pass return name - def rectangle_delete(self, name): + def delete(self, name): try: - del self.rectangles[name] + del self._rectangles[name] except KeyError: pass - def circles_create(self, params): - name = params['name'] - if name in self.circles: - raise InvalidOperation("Circle %s already exists" % name) - self.circles[name] = Circle(params['radius']) - return name - def circles_get_list(self): - return sorted(self.circles) - - def circle_lookup(self, name): - try: - circle = self.circles[name] - except KeyError: - raise NotFoundError("Circle %s not found" % name) - return {'radius': circle.radius} +class Model(RootModel): + def __init__(self): + circles = CirclesModel() + circle = CircleModel(circles) - def circle_update(self, name, params): - if name not in self.circles: - raise NotFoundError("Circle %s not found" % name) - self.circles[name].radius = params['radius'] - return name + rectangles = RectanglesModel() + rectangle = RectangleModel(rectangles) - def circle_delete(self, name): - try: - del self.circles[name] - except KeyError: - pass + return super(Model, self).__init__( + [circle, circles, rectangle, rectangles]) class Rectangle(object): -- 1.7.11.7

3 3