You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ambari.apache.org by xi...@apache.org on 2014/12/03 04:17:43 UTC
ambari git commit: AMBARI-8516. Alerts UI: Alert-definition instance
counts should be displayed consistently.(xiwang)
Repository: ambari
Updated Branches:
refs/heads/trunk 9280bb1d3 -> 956a0e708
AMBARI-8516. Alerts UI: Alert-definition instance counts should be displayed consistently.(xiwang)
Project: http://git-wip-us.apache.org/repos/asf/ambari/repo
Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/956a0e70
Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/956a0e70
Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/956a0e70
Branch: refs/heads/trunk
Commit: 956a0e70849a6d544a06332a8c2cfdedfa0d74f3
Parents: 9280bb1
Author: Xi Wang <xi...@apache.org>
Authored: Tue Dec 2 18:47:58 2014 -0800
Committer: Xi Wang <xi...@apache.org>
Committed: Tue Dec 2 19:13:51 2014 -0800
----------------------------------------------------------------------
ambari-web/app/models/alert_definition.js | 43 +++++++++++++-------
ambari-web/app/models/alert_instance.js | 9 +---
ambari-web/app/styles/alerts.less | 25 +++++++++---
.../alerts/configs/alert_config_threshold.hbs | 16 +++++---
ambari-web/test/models/alert_definition_test.js | 24 +++++++----
5 files changed, 77 insertions(+), 40 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/ambari/blob/956a0e70/ambari-web/app/models/alert_definition.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/models/alert_definition.js b/ambari-web/app/models/alert_definition.js
index 669a9c2..6f0702c 100644
--- a/ambari-web/app/models/alert_definition.js
+++ b/ambari-web/app/models/alert_definition.js
@@ -74,21 +74,38 @@ App.AlertDefinition = DS.Model.extend({
/**
* Status generates from child-alerts
- * Format: 1 OK / 2 WARN / 1 CRIT / 1 UNKNOWN
+ * Format: OK(1) WARN(2) CRIT(1) UNKN(1)
+ * If single host: show: OK/WARNING/CRITICAL/UNKNOWN
* If some there are no alerts with some state, this state isn't shown
+ * If no OK/WARN/CRIT/UNKN state, then show PENDING
* Order is equal to example
* @type {string}
*/
status: function () {
- var typeIcons = this.get('typeIcons'),
- order = this.get('order'),
- summary = this.get('summary');
- return order.map(function (state) {
- if (summary[state]) {
- return summary[state] + ' <span class="' + typeIcons[state] + ' alert-state-' + state + '"></span>';
- }
- return null;
- }).compact().join(' / ');
+ var order = this.get('order'),
+ summary = this.get('summary'),
+ hostCnt = 0;
+ order.forEach(function(state) {
+ var cnt = summary[state] ? summary[state] : 0;
+ hostCnt += cnt;
+ });
+ if (hostCnt > 1) {
+ // multiple hosts
+ return order.map(function (state) {
+ var shortState = state.substring(0, 4);
+ return summary[state] ? '<span class="label alert-state-' + state + '">' + shortState + ' ( ' + summary[state] + ' )</span>' : null;
+ }).compact().join(' ');
+ } else if (hostCnt == 1) {
+ // single host, single status
+ return order.map(function (state) {
+ return summary[state] ? '<span class="alert-state-single-host label alert-state-'+ state + '">' + state + '</span>' : null;
+ }).compact().join(' ');
+ } else if (hostCnt == 0) {
+ // penging
+ var state = 'PENDING';
+ return '<span class="alert-state-single-host label alert-state-'+ state + '">' + state + '</span>';
+ }
+ return null;
}.property('summary'),
/**
@@ -124,11 +141,7 @@ App.AlertDefinition = DS.Model.extend({
* @type {object}
*/
typeIcons: {
- 'OK': 'icon-ok-sign',
- 'WARNING': 'icon-warning-sign',
- 'CRITICAL': 'icon-remove',
- 'DISABLED': 'icon-off',
- 'UNKNOWN': 'icon-question-sign'
+ 'DISABLED': 'icon-off'
},
/**
http://git-wip-us.apache.org/repos/asf/ambari/blob/956a0e70/ambari-web/app/models/alert_instance.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/models/alert_instance.js b/ambari-web/app/models/alert_instance.js
index 113fbd2..86ab4b7 100644
--- a/ambari-web/app/models/alert_instance.js
+++ b/ambari-web/app/models/alert_instance.js
@@ -45,9 +45,8 @@ App.AlertInstance = DS.Model.extend({
* @type {App.AlertDefinition[]}
*/
status: function () {
- var typeIcons = this.get('typeIcons');
var state = this.get('state');
- return '<span class="' + typeIcons[state] + ' alert-state-' + state + '"></span>';
+ return '<span class="label alert-state-single-host alert-state-' + state + '">' + state + '</span>';
}.property('state'),
/**
@@ -72,11 +71,7 @@ App.AlertInstance = DS.Model.extend({
* @type {object}
*/
typeIcons: {
- 'OK': 'icon-ok-sign',
- 'WARNING': 'icon-warning-sign',
- 'CRITICAL': 'icon-remove',
- 'DISABLED': 'icon-off',
- 'UNKNOWN': 'icon-question-sign'
+ 'DISABLED': 'icon-off'
}
});
http://git-wip-us.apache.org/repos/asf/ambari/blob/956a0e70/ambari-web/app/styles/alerts.less
----------------------------------------------------------------------
diff --git a/ambari-web/app/styles/alerts.less b/ambari-web/app/styles/alerts.less
index f1697de..77dc8fd 100644
--- a/ambari-web/app/styles/alerts.less
+++ b/ambari-web/app/styles/alerts.less
@@ -18,15 +18,15 @@
@import 'common.less';
.alert-state-OK {
- color: @health-status-green;
+ background-color: @health-status-green;
}
.alert-state-WARNING {
- color: @health-status-red;
+ background-color: @health-status-orange;
}
.alert-state-CRITICAL {
- color: @health-status-red;
+ background-color: @health-status-red;
}
.alert-state-DISABLED {
@@ -34,7 +34,17 @@
}
.alert-state-UNKNOWN {
- color: @health-status-yellow;
+ background-color: @health-status-yellow;
+}
+
+.alert-state-PENDING {
+ background-color: #999;
+}
+
+.alert-state-single-host {
+ display: inline-block;
+ width: 70px;
+ text-align: center;
}
.groups-filter {
@@ -160,7 +170,10 @@
.status {
margin-bottom: 30px;
text-align: center;
- font-size: 20px;
+ .label {
+ font-size: 14px;
+ padding: 5px 8px;
+ }
}
.right-column {
@@ -387,7 +400,7 @@
.status-icon {
padding-left: 5px;
float: left;
- width: 5%;
+ width: 10%;
min-width: 20px;
}
.name-text {
http://git-wip-us.apache.org/repos/asf/ambari/blob/956a0e70/ambari-web/app/templates/main/alerts/configs/alert_config_threshold.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/alerts/configs/alert_config_threshold.hbs b/ambari-web/app/templates/main/alerts/configs/alert_config_threshold.hbs
index 746524a..9fe72ed 100644
--- a/ambari-web/app/templates/main/alerts/configs/alert_config_threshold.hbs
+++ b/ambari-web/app/templates/main/alerts/configs/alert_config_threshold.hbs
@@ -16,9 +16,15 @@
* limitations under the License.
}}
-<span class="icon-ok-sign alert-state-OK"></span>
-{{view Em.TextField valueBinding="view.property.from" disabledBinding="view.property.isDisabled" class="span2"}}
-<span class="icon-warning-sign alert-state-WARNING"></span>
-{{view Em.TextField valueBinding="view.property.to" disabledBinding="view.property.isDisabled" class="span2"}}
-<span class="icon-remove-sign alert-state-CRITICAL"></span>
+<div class="control-group">
+ <span class="alert-state-single-host label alert-state-WARNING">WARNING</span>
+ {{view Em.TextField valueBinding="view.property.from" disabledBinding="view.property.isDisabled" class="span2"}}
+</div>
+
+<div>
+ <span class="alert-state-single-host label alert-state-CRITICAL">CRITICAL</span>
+ {{view Em.TextField valueBinding="view.property.to" disabledBinding="view.property.isDisabled" class="span2"}}
+</div>
+
+
http://git-wip-us.apache.org/repos/asf/ambari/blob/956a0e70/ambari-web/test/models/alert_definition_test.js
----------------------------------------------------------------------
diff --git a/ambari-web/test/models/alert_definition_test.js b/ambari-web/test/models/alert_definition_test.js
index 2f66c16..9dea494 100644
--- a/ambari-web/test/models/alert_definition_test.js
+++ b/ambari-web/test/models/alert_definition_test.js
@@ -36,17 +36,27 @@ describe('App.AlertDefinition', function() {
{
summary: {OK: 1, UNKNOWN: 1, WARNING: 2},
m: 'No CRITICAL',
- e: '1 <span class="icon-ok-sign alert-state-OK"></span> / ' +
- '2 <span class="icon-warning-sign alert-state-WARNING"></span> / ' +
- '1 <span class="icon-question-sign alert-state-UNKNOWN"></span>'
+ e: '<span class="label alert-state-OK">OK ( 1 )</span> ' +
+ '<span class="label alert-state-WARNING">WARN ( 2 )</span> ' +
+ '<span class="label alert-state-UNKNOWN">UNKN ( 1 )</span>'
},
{
summary: {WARNING: 2, CRITICAL: 3, UNKNOWN: 1, OK: 1},
m: 'All states exists',
- e: '1 <span class="icon-ok-sign alert-state-OK"></span> / ' +
- '2 <span class="icon-warning-sign alert-state-WARNING"></span> / ' +
- '3 <span class="icon-remove alert-state-CRITICAL"></span> / ' +
- '1 <span class="icon-question-sign alert-state-UNKNOWN"></span>'
+ e: '<span class="label alert-state-OK">OK ( 1 )</span> ' +
+ '<span class="label alert-state-WARNING">WARN ( 2 )</span> ' +
+ '<span class="label alert-state-CRITICAL">CRIT ( 3 )</span> ' +
+ '<span class="label alert-state-UNKNOWN">UNKN ( 1 )</span>'
+ },
+ {
+ summary: {OK: 1},
+ m: 'Single host',
+ e: '<span class="alert-state-single-host label alert-state-OK">OK</span>'
+ },
+ {
+ summary: {},
+ m: 'Pending',
+ e: '<span class="alert-state-single-host label alert-state-PENDING">PENDING</span>'
}
]).forEach(function(test) {
it(test.m, function() {