You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ambari.apache.org by al...@apache.org on 2015/12/30 14:26:13 UTC
ambari git commit: AMBARI-11670. Width of services menu container is
fixed and causes part of longer service names to be rendered outside the
frame (alexantonenko)
Repository: ambari
Updated Branches:
refs/heads/trunk 1c40e9c29 -> df267643d
AMBARI-11670. Width of services menu container is fixed and causes part of longer service names to be rendered outside the frame (alexantonenko)
Project: http://git-wip-us.apache.org/repos/asf/ambari/repo
Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/df267643
Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/df267643
Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/df267643
Branch: refs/heads/trunk
Commit: df267643d7ff1d03eeb12ff82eea45720f76c132
Parents: 1c40e9c
Author: Alex Antonenko <hi...@gmail.com>
Authored: Wed Dec 30 15:25:59 2015 +0200
Committer: Alex Antonenko <hi...@gmail.com>
Committed: Wed Dec 30 15:26:08 2015 +0200
----------------------------------------------------------------------
ambari-web/app/assets/test/tests.js | 3 +-
ambari-web/app/styles/application.less | 23 +++++--
.../app/templates/main/service/menu_item.hbs | 22 +++----
ambari-web/app/views/main/service/menu.js | 4 +-
ambari-web/test/views/main/service/menu_test.js | 67 ++++++++++++++++++++
5 files changed, 102 insertions(+), 17 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/ambari/blob/df267643/ambari-web/app/assets/test/tests.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/assets/test/tests.js b/ambari-web/app/assets/test/tests.js
index d13767f..76c9e98 100644
--- a/ambari-web/app/assets/test/tests.js
+++ b/ambari-web/app/assets/test/tests.js
@@ -333,7 +333,8 @@ var files = [
'test/models/stack_version/repository_version_test',
'test/routes/views_test',
//contains test with fake timers that affect Date
- 'test/utils/lazy_loading_test'
+ 'test/utils/lazy_loading_test',
+ 'test/views/main/service/menu_test'
];
App.initialize();
http://git-wip-us.apache.org/repos/asf/ambari/blob/df267643/ambari-web/app/styles/application.less
----------------------------------------------------------------------
diff --git a/ambari-web/app/styles/application.less b/ambari-web/app/styles/application.less
index 381459a..eaadee6 100644
--- a/ambari-web/app/styles/application.less
+++ b/ambari-web/app/styles/application.less
@@ -2442,6 +2442,19 @@ a:focus {
padding-left:6px;
}
}
+a.services-menu-blocks{
+ overflow:auto;
+ .icon-health-block{
+ width:16%;
+ float:left;
+ }
+ .service-name-block{
+ width:55%;
+ float:left;
+ white-space:normal;
+ word-break:break-word;
+ }
+}
.quick-links-wrapper {
margin-top: -53px;
position: relative;
@@ -3680,7 +3693,7 @@ table.graphs {
.services-menu {
.icon-refresh {
color: @restart-indicator-color;
- margin-left: 1px;
+ margin-left: 4px;
}
}
#host-details, #serviceConfig {
@@ -5124,7 +5137,8 @@ i.icon-asterisks {
float: left;
width: 100%;
min-height: 30px;
- margin-left: 2.564102564102564%;
+ margin-left: 1.282051282051282%;
+ *margin-left: 2.564102564102564%;
*margin-left: 2.5109110747408616%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
@@ -5190,7 +5204,8 @@ i.icon-asterisks {
}
.row-fluid .span2 {
- width: 14.52991452991453%;
+ width: 15.811965811965812%;
+ *width: 14.52991452991453%;
*width: 14.476723040552828%;
}
@@ -5473,7 +5488,7 @@ i.icon-asterisks {
.services-menu .nav-list li {
.label.alerts-count {
- margin-right: 4px;
+ margin-right: 0;
}
.icon-laptop {
padding-left: 5px;
http://git-wip-us.apache.org/repos/asf/ambari/blob/df267643/ambari-web/app/templates/main/service/menu_item.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/service/menu_item.hbs b/ambari-web/app/templates/main/service/menu_item.hbs
index 8842858..6e69fbb 100644
--- a/ambari-web/app/templates/main/service/menu_item.hbs
+++ b/ambari-web/app/templates/main/service/menu_item.hbs
@@ -16,18 +16,18 @@
* limitations under the License.
}}
-<a {{bindAttr href="view.link"}}>
- <div {{bindAttr class="view.alertsCount:with-alert :service-caption"}}>
+<a class="services-menu-blocks" {{bindAttr href="view.link"}}>
+ {{#if view.alertsCount}}
+ <span {{bindAttr class=":label :alerts-count view.hasCriticalAlerts:alerts-crit-count:alerts-warn-count"}}>
+ {{view.alertsCount}}
+ </span>
+ {{/if}}
+
+ <div class="icon-health-block">
{{view App.MainDashboardServiceHealthView class="service-health" serviceBinding="view.content"}}
- <span>{{unbound view.content.displayName}}</span>
- <i rel="tooltip" {{action goToConfigs target="view"}}{{bindAttr class=":icon-refresh :restart-required-service view.content.isRestartRequired::hidden" data-original-title="view.restartRequiredMessage"}}></i>
</div>
-
- <div class="icon-caption">
- {{#if view.alertsCount}}
- <span {{bindAttr class=":label :alerts-count view.hasCriticalAlerts:alerts-crit-count:alerts-warn-count"}}>
- {{view.alertsCount}}
- </span>
- {{/if}}
+ <div class="service-name-block">
+ <span>{{unbound view.content.displayName}}</span>
</div>
+ <i rel="tooltip" {{action goToConfigs target="view"}}{{bindAttr class=":icon-refresh :restart-required-service view.content.isRestartRequired::hidden" data-original-title="view.restartRequiredMessage"}}></i>
</a>
http://git-wip-us.apache.org/repos/asf/ambari/blob/df267643/ambari-web/app/views/main/service/menu.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/main/service/menu.js b/ambari-web/app/views/main/service/menu.js
index cd54288..f5768f8 100644
--- a/ambari-web/app/views/main/service/menu.js
+++ b/ambari-web/app/views/main/service/menu.js
@@ -69,7 +69,9 @@ App.MainServiceMenuView = Em.CollectionView.extend({
return this.get('content.id') == this.get('parentView.activeServiceId') ? 'active' : '';
}.property('parentView.activeServiceId'),
- alertsCount: Em.computed.alias('content.alertsCount'),
+ alertsCount: function () {
+ return this.get('content.alertsCount') > 99 ? "99+" : this.get('content.alertsCount') ;
+ }.property('content.alertsCount'),
hasCriticalAlerts: Em.computed.alias('content.hasCriticalAlerts'),
http://git-wip-us.apache.org/repos/asf/ambari/blob/df267643/ambari-web/test/views/main/service/menu_test.js
----------------------------------------------------------------------
diff --git a/ambari-web/test/views/main/service/menu_test.js b/ambari-web/test/views/main/service/menu_test.js
new file mode 100644
index 0000000..15f0c15
--- /dev/null
+++ b/ambari-web/test/views/main/service/menu_test.js
@@ -0,0 +1,67 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you 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.
+ */
+
+var App = require('app');
+require('views/main/service/menu');
+
+describe('App.MainServiceMenuView', function () {
+
+ var mainServiceMenuView;
+
+ beforeEach(function(){
+ mainServiceMenuView = App.MainServiceMenuView.create();
+ var view = mainServiceMenuView.get('itemViewClass').create({
+ content:{
+ alertsCount: 2
+ }
+ });
+ mainServiceMenuView.set('itemViewClass',view);
+ });
+
+ var cases = [
+ {
+ title:'alertsCount=0 test case:',
+ alertsCount:0,
+ result:0
+ },
+ {
+ title:'alertsCount=5 test case:',
+ alertsCount:5,
+ result:5
+ },
+ {
+ title:'alertsCount=200 test case:',
+ alertsCount:200,
+ result:"99+"
+ },
+ {
+ title:'alertsCount=99 test case:',
+ alertsCount:99,
+ result:99
+ }
+ ];
+
+
+ cases.forEach(function(item){
+ it(item.title,function(){
+ mainServiceMenuView.get('itemViewClass').set('content.alertsCount',item.alertsCount);
+ expect(mainServiceMenuView.get('itemViewClass.alertsCount')).to.not.be.undefined;
+ expect(mainServiceMenuView.get('itemViewClass.alertsCount')).to.equal(item.result);
+ });
+ });
+});