x/compass-web
Code Issues Proposed changes

Merge "Adjust roles panel width, update role colors on Role Assign page"

Browse Source
This commit is contained in:
Jenkins
2014-10-10 02:48:07 +00:00
committed by Gerrit Code Review
parent 1b8ab3b4af d74e92bbb9
commit fd426e0eb2
4 changed files with 26 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
v2/assets/css/style.css
View File

@@ -105,6 +105,12 @@ body, .main-content {
vertical-align: baseline;
white-space: nowrap;
overflow: hidden;
width: 150px;
}
.role-tag .close {
margin-right: -15px;
cursor: pointer;
font-size: 16px;
}
.no-border-search {
padding-left: 10px;
@@ -998,21 +1004,23 @@ circle[depth='4'] {
margin-left: -4px;
}
.table-col {
width: 75%;
width: 80%;
}
.role-col {
width: 24%;
margin-left: 1%;
max-width: 300px;
width: 19%;
}
.role-panel {
z-index: 10;
margin-left: 10px;
margin-right: -25px;
margin-left: 30px;
}
.role-panel.stick {
position: fixed;
z-index: 10000;
top: 0px;
width: 24%;
padding-right: 30px;
width: 19%;
}
.role-assign-drag {
border: 1px solid rgba(190, 210, 219, 0.5) !important;
@@ -1030,6 +1038,7 @@ circle[depth='4'] {
display: block !important;
border-radius: 4px !important;
cursor: move;
width: auto;
}
.drag-enter-role {
background: none repeat scroll 0 0 #F0F9FF;
@@ -1053,6 +1062,7 @@ circle[depth='4'] {
text-align: center;
vertical-align: baseline;
white-space: nowrap;
margin-right: 2px;
}
.autofill-success {
margin-top: 20px;

2
v2/src/app/wizard/network_mapping.tpl.html
View File

@@ -36,7 +36,7 @@
<br>
<p>Use drag and drop to move logical networks between physical interfaces. (Interface assigned Promisc Mode can only map with External network)</p>
<div class="widget-body">
<div class="widget-main network-background">
<div class="widget-main row network-background">
<div ui-on-Drop="onDrop($event, '')" drag-hover-class="drag-enter" class="network-placeholder network-margin-border" drop-channel="external others">
<div ng-repeat="(key, value) in networking" ui-draggable="true" on-drop-success="dropSuccessHandler($event, key, networking);" class="external-event ui-draggable network-draggable network-margin margin-right-20 fade-animation" ng-class="{'label-pink': key == 'management', 'label-success': key =='tenant', 'label-purple': key == 'external', 'label-warning': key == 'storage', 'label-info': key == 'public_network', 'label-red': key == 'cluster_network'}" drag-channel="{{value.dragChannel}}" ng-if="!value.mapping_interface">
<i class="ace-icon fa fa-arrows"></i>

13
v2/src/app/wizard/role_assignment.tpl.html
View File

@@ -9,7 +9,7 @@
<div class="col-xs-12">
<form name="autoAssignForm" role="form" class="form-horizontal">
<div ng-repeat="role in roles" class="form-group">
<label class="col-sm-4 control-label no-padding-right">{{role.display_name}}</label>
<label class="col-sm-4 control-label no-padding-right capitalize">{{role.display_name}}</label>
<div class="col-sm-8" ng-init="role.count=1">
<input type="number" min="0" class="col-xs-10 col-sm-5" ng-model="role.count" placeholder="Count">
</div>
@@ -128,16 +128,19 @@
</td>
<td>
<div class="role-assign-drop" ui-on-Drop="onDrop($event, server)" drag-hover-class="drag-enter-role" drop-channel="{{server.dropChannel}}">
<alert ng-repeat="role in server['roles']" close="removeRole(server, role)" class="role-tag border-radius-4" ng-style="{'background-color': role.color}">
{{role.display_name}}
</alert>
<span ng-repeat="role in server['roles']" class="role-tag border-radius-4" ng-style="{'background-color': role.color}" tooltip="{{role.display_name}}">
<span class="pull-left">{{role.display_name | limitTo : 15}}</span>
<span class="pull-right close" ng-click="removeRole(server, role)">
<i class="ace-icon fa fa-times white"></i>
</span>
</span>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="pull-right role-col">
<div class="pull-left role-col">
<div id="sticky-anchor"></div>
<div class="row role-panel" rolepanelscroll>
<div class="blue">

3
v2/src/app/wizard/wizard.js
View File

@@ -1267,7 +1267,8 @@ define(['uiRouter', 'angularTable', 'angularDragDrop', 'angularTouch', 'ngSpinne
wizardModule.controller('roleAssignCtrl', function($scope, wizardFactory, dataService, $filter, ngTableParams, sortingService, $q) {
var cluster = wizardFactory.getClusterInfo();
$scope.servers = wizardFactory.getServers();
var colors = ['#8EA16C', '#C2CF30', '#FEC700', '#FF8900', '#D3432B', '#BB2952', '#8E1E5F', '#DE4AB6', '#9900EC', '#3A1AA8', '#3932FE', '#278BC0', '#35B9F6', '#91E0CB', '#42BC6A', '#5B4141'];
//var colors = ['#8EA16C', '#C2CF30', '#FEC700', '#FF8900', '#D3432B', '#BB2952', '#8E1E5F', '#DE4AB6', '#9900EC', '#3A1AA8', '#3932FE', '#278BC0', '#35B9F6', '#91E0CB', '#42BC6A', '#5B4141'];
var colors = ['#a4ebc6', '#cbe375', '#f5d185', '#ee9f97', '#de8ea8', '#8a8ae7', '#85c9fc', '#ffdc4d', '#f2af58', '#f1a3d7', '#e0a9f8', '#88e8db', '#7dc9df', '#bfbfbf', '#bece91', '#84efa7'];
$scope.existingRoles = [];
$scope.realRole = [];