From: Wen Wang <wenwang(a)linux.vnet.ibm.com&gt; v2 -> V3: Add a global variable "_tabMode" into JS code under kimchi.main.js that indicates mode for each tab(Yu Xin, Aline) V1 -> V2: read only "roles" from cookie instead of roles of each tab(Aline) This patch removed host/template tabs from non-root users Signed-off-by: Wen Wang <wenwang(a)linux.vnet.ibm.com&gt; --- ui/js/src/kimchi.main.js | 26 ++++++++++++++++++-------- 1 files changed, 18 insertions(+), 8 deletions(-) diff --git a/ui/js/src/kimchi.main.js b/ui/js/src/kimchi.main.js index 8eb4d73..01ebded 100644 --- a/ui/js/src/kimchi.main.js +++ b/ui/js/src/kimchi.main.js @@ -15,6 +15,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ +var _tabMode = {}; kimchi.main = function() { kimchi.popable(); @@ -23,13 +24,16 @@ kimchi.main = function() { $(tabs).each(function(i, tab) { var title = tab['title']; var path = tab['path']; - tabsHtml.push( - '<li>', - '<a class="item" href="', path, '">', - title, - '</a>', - '</li>' - ); + var mode = tab['mode']; + if (mode != 'none') { + tabsHtml.push( + '<li>', + '<a class="item" href="', path, '">', + title, + '</a>', + '</li>' + ); + } }); return tabsHtml.join(''); }; @@ -41,9 +45,15 @@ kimchi.main = function() { var titleKey = $tab.find('title').text(); var title = i18n[titleKey] ? i18n[titleKey] : titleKey; var path = $tab.find('path').text(); + var roles = kimchi.cookie.get('roles'); + var roleString = 'JSON.parse(roles).' + titleKey.toLowerCase(); + var role = eval(roleString); + var mode = $tab.find('[role="' + role + '"]').attr('mode'); + _tabMode[titleKey.toLowerCase()] = mode; tabs.push({ title: title, - path: path + path: path, + mode: mode }); }); -- 1.7.1

From: Wen Wang <wenwang(a)linux.vnet.ibm.com&gt; V3 -> V4: Removed the additional white border line in user mode(Aline) Minor change to the layout of the storage tab of user mode that makes the arrow-down/arrow-up more consistent(Aline) V2 -> V3: Fixed the cookie usage error. Hide the actions buttons and show if user has admin mode. Fixed css inconsistence in storage tab Remove associated actions of the action button if user is not root V1 -> V2: Minor changes in method of removing "Action" title under network tab (Hongliang Wang) Authorization: remove actions menu from storage/network tabs for non-root users Signed-off-by: Wen Wang <wenwang(a)linux.vnet.ibm.com&gt; --- ui/css/theme-default/network.css | 4 + ui/css/theme-default/storage.css | 22 ++++--- ui/js/src/kimchi.network.js | 6 ++ ui/js/src/kimchi.storage_main.js | 127 ++++++++++++++++++++------------------ ui/pages/tabs/network.html.tmpl | 4 +- ui/pages/tabs/storage.html.tmpl | 4 +- 6 files changed, 95 insertions(+), 72 deletions(-) diff --git a/ui/css/theme-default/network.css b/ui/css/theme-default/network.css index df66b75..a993fd6 100644 --- a/ui/css/theme-default/network.css +++ b/ui/css/theme-default/network.css @@ -94,6 +94,10 @@ width: 270px; } +.network .list .item .column-space-no-border-right { + border-right: none; +} + .network .list .column-action { display: inline-block; position: absolute; diff --git a/ui/css/theme-default/storage.css b/ui/css/theme-default/storage.css index e94c1ec..dfd8410 100644 --- a/ui/css/theme-default/storage.css +++ b/ui/css/theme-default/storage.css @@ -17,7 +17,11 @@ */ /* STORAGE */ .handle { - width: 5%; + width: 49px; +} + +.storage-allocate-padding-user { + padding-right: 108px; } .storage-title { @@ -148,37 +152,37 @@ } .storage-name { - width: 20%; + width: 199px; } .storage-state { - width: 5%; + width: 51px; } .storage-location { - width: 29%; + width: 288px; } .storage-type { - width: 10%; + width: 98px; } .storage-capacity { - width: 10%; + width: 98px; } .storage-allocate { - width: 10%; + width: 98px; } .storage-button { - width: 11%; + width: 108px; text-align: center; } .title-name { - width: 198px; + width: 199px; } .title-state { diff --git a/ui/js/src/kimchi.network.js b/ui/js/src/kimchi.network.js index c0978da..5b811ca 100644 --- a/ui/js/src/kimchi.network.js +++ b/ui/js/src/kimchi.network.js @@ -22,6 +22,7 @@ kimchi.initNetwork = function() { var networkMode = _tabMode['network']; if(networkMode === 'admin') { $('.tools').attr('style','display'); + $('#network-content .header span:last-child').attr('style','display'); kimchi.initNetworkCreation(); } kimchi.initNetworkListView(); @@ -52,6 +53,11 @@ kimchi.initNetworkListView = function() { kimchi.addNetworkItem = function(network) { $("#networkBody").append(kimchi.getNetworkItemHtml(network)); + if(_tabMode["network"] === "admin") { + $(".column-action").attr("style","display"); + } else { + $(".column-space").addClass('column-space-no-border-right'); + } kimchi.addNetworkActions(network); }; diff --git a/ui/js/src/kimchi.storage_main.js b/ui/js/src/kimchi.storage_main.js index a84ce0f..4b6fd13 100644 --- a/ui/js/src/kimchi.storage_main.js +++ b/ui/js/src/kimchi.storage_main.js @@ -30,6 +30,11 @@ kimchi.doListStoragePools = function() { } }); $('#storagepoolsList').html(listHtml); + if(_tabMode['storage'] === 'admin') { + $('.storage-button').attr('style','display'); + } else { + $('.storage-allocate').addClass('storage-allocate-padding-user'); + } kimchi.storageBindClick(); } else { $('#storagepoolsList').html(''); @@ -74,79 +79,82 @@ kimchi.storageBindClick = function() { } }); - $('.pool-delete').on('click', function(event) { - var $pool = $(this); - var settings = { - title : i18n['KCHAPI6001M'], - content : i18n['KCHPOOL6001M'], - confirm : i18n['KCHAPI6002M'], - cancel : i18n['KCHAPI6003M'] - }; - kimchi.confirm(settings, function() { - var poolName = $pool.data('name'); - kimchi.deleteStoragePool(poolName, function() { + if(_tabMode['storage'] === 'admin') { + $('.pool-delete').on('click', function(event) { + var $pool = $(this); + var settings = { + title : i18n['KCHAPI6001M'], + content : i18n['KCHPOOL6001M'], + confirm : i18n['KCHAPI6002M'], + cancel : i18n['KCHAPI6003M'] + }; + kimchi.confirm(settings, function() { + var poolName = $pool.data('name'); + kimchi.deleteStoragePool(poolName, function() { + kimchi.doListStoragePools(); + }, function(err) { + kimchi.message.error(err.responseJSON.reason); + }); + }); + }); + + $('.pool-activate').on('click', function(event) { + var poolName = $(this).data('name'); + kimchi.changePoolState(poolName, 'activate', function() { kimchi.doListStoragePools(); }, function(err) { kimchi.message.error(err.responseJSON.reason); }); }); - }); - $('.pool-activate').on('click', function(event) { - var poolName = $(this).data('name'); - kimchi.changePoolState(poolName, 'activate', function() { - kimchi.doListStoragePools(); - }, function(err) { - kimchi.message.error(err.responseJSON.reason); - }); - }); - - $('.pool-deactivate').on('click', function(event) { - var poolName = $(this).data('name'); - var settings = { - title : i18n['KCHAPI6001M'], - content : i18n['KCHPOOL6012M'], - confirm : i18n['KCHAPI6002M'], - cancel : i18n['KCHAPI6003M'] - }; - if (!$(this).data('persistent')) { - kimchi.confirm(settings, function() { + $('.pool-deactivate').on('click', function(event) { + var poolName = $(this).data('name'); + var settings = { + title : i18n['KCHAPI6001M'], + content : i18n['KCHPOOL6012M'], + confirm : i18n['KCHAPI6002M'], + cancel : i18n['KCHAPI6003M'] + }; + if (!$(this).data('persistent')) { + kimchi.confirm(settings, function() { + kimchi.changePoolState(poolName, 'deactivate', function() { + kimchi.doListStoragePools(); + }, function(err) { + kimchi.message.error(err.responseJSON.reason); + }); + }, function() { + return false; + }); + } + else { kimchi.changePoolState(poolName, 'deactivate', function() { kimchi.doListStoragePools(); }, function(err) { kimchi.message.error(err.responseJSON.reason); }); - }, function() { - return false; - }); - } - else { - kimchi.changePoolState(poolName, 'deactivate', function() { - kimchi.doListStoragePools(); - }, function(err) { - kimchi.message.error(err.responseJSON.reason); - }); - } - }); + } + }); - $('.storage-action').on('click', function() { - var storage_action = $(this); - var deleteButton = storage_action.find('.pool-delete'); - if ('active' === deleteButton.data('stat')) { - deleteButton.attr('disabled', 'disabled'); - } else { - deleteButton.removeAttr('disabled'); - } - }); + $('.storage-action').on('click', function() { + var storage_action = $(this); + var deleteButton = storage_action.find('.pool-delete'); + if ('active' === deleteButton.data('stat')) { + deleteButton.attr('disabled', 'disabled'); + } else { + deleteButton.removeAttr('disabled'); + } + }); - $('.pool-extend').on('click', function() { - $("#logicalPoolExtend").dialog("option", "poolName", $(this).data('name')); - $("#logicalPoolExtend").dialog("open"); - }); + $('.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'); + }); + } - $('#volume-doAdd').on('click', function() { - kimchi.window.open('storagevolume-add.html'); - }); $('.storage-li').on('click', function(event) { if (!$(event.target).parents().hasClass('bottom')) { if ($(this).data('stat') === 'active') { @@ -240,6 +248,7 @@ kimchi.storage_main = function() { $('#storage-pool-add').on('click', function() { kimchi.window.open('storagepool-add.html'); }); + $('.list-title .title-actions').attr('style','display'); } kimchi.doListStoragePools(); kimchi.initLogicalPoolExtend(); diff --git a/ui/pages/tabs/network.html.tmpl b/ui/pages/tabs/network.html.tmpl index b6091f8..ab57c98 100644 --- a/ui/pages/tabs/network.html.tmpl +++ b/ui/pages/tabs/network.html.tmpl @@ -38,7 +38,7 @@ --><span class="column column-type">$_("Network Type")</span><!-- --><span class="column column-interface">$_("Interface")</span><!-- --><span class="column column-space">$_("Address Space")</span><!-- - --><span class="column">$_("Actions")</span> + --><span class="column" style="display:none">$_("Actions")</span> </div> <div id="networkBody" class="empty-when-logged-off"></div> </div> @@ -104,7 +104,7 @@ --><span class='column column-type cell'>{type}</span><!-- --><span class='column column-interface cell'>{interface}</span><!-- --><span class='column column-space cell'>{addrSpace}</span><!-- - --><span class='column-action'> + --><span class='column-action' style="display:none"> <span class="ui-button-secondary dropdown popable action-button"> $_("Actions") <ul class='popover actionsheet right-side menu-container'> diff --git a/ui/pages/tabs/storage.html.tmpl b/ui/pages/tabs/storage.html.tmpl index 72eaafd..3b11e55 100644 --- a/ui/pages/tabs/storage.html.tmpl +++ b/ui/pages/tabs/storage.html.tmpl @@ -37,7 +37,7 @@ <li class="title-type">$_("Type")</li> <li class="title-capacity">$_("Capacity")</li> <li class="title-allocate">$_("Allocated")</li> - <li class="title-actions">$_("Actions")</li> + <li class="title-actions" style="display:none">$_("Actions")</li> </div> <ul id="storagepoolsList" class="list-storage empty-when-logged-off"></ul> </div> @@ -76,7 +76,7 @@ <div class="storage-allocate"> <div class="storage-text" data-type="{type}">{allocated}</div> </div> - <div class="bottom storage-button"> + <div class="bottom storage-button" style="display:none"> <div class="btn dropdown popable storage-action" data-state="{state}" data-type="{type}" data-name="{name}"> <span class="text">$_("Actions")</span><span class="arrow"></span> <div class="popover actionsheet right-side" style="width: 250px"> -- 1.7.1