AMBARI-4901. 'HDFS Capacity' widget rename and enhancements to clarify HDFS disk usage.(xiwang)
Project: http://git-wip-us.apache.org/repos/asf/ambari/repo Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/2efb7795 Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/2efb7795 Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/2efb7795 Branch: refs/heads/trunk Commit: 2efb77958e69f95ee44606f13ec25103b1e9e7c2 Parents: 9069cb2 Author: Xi Wang <xiw...@apache.org> Authored: Fri Feb 28 17:39:09 2014 -0800 Committer: Xi Wang <xiw...@apache.org> Committed: Tue Mar 11 17:24:51 2014 -0700 ---------------------------------------------------------------------- ambari-web/app/messages.js | 13 ++++++-- ambari-web/app/styles/application.less | 31 +++++++++++++++----- .../templates/main/dashboard/service/hdfs.hbs | 14 +++++++-- .../main/dashboard/widgets/pie_chart.hbs | 28 +++++++++--------- .../app/views/main/dashboard/service/hdfs.js | 31 ++++++++++++++++---- ambari-web/app/views/main/dashboard/widget.js | 12 ++++---- .../main/dashboard/widgets/hdfs_capacity.js | 29 +++++++++++++----- 7 files changed, 113 insertions(+), 45 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ambari/blob/2efb7795/ambari-web/app/messages.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/messages.js b/ambari-web/app/messages.js index 09a1ad2..875fc29 100644 --- a/ambari-web/app/messages.js +++ b/ambari-web/app/messages.js @@ -1612,7 +1612,11 @@ Em.I18n.translations = { 'dashboard.widgets.NameNodeHeap': 'NameNode Heap', 'dashboard.widgets.NameNodeCpu': 'NameNode CPU WIO', - 'dashboard.widgets.NameNodeCapacity': 'HDFS Capacity', + 'dashboard.widgets.HDFSDiskUsage': 'HDFS Disk Usage', + 'dashboard.widgets.HDFSDiskUsage.DFSused': 'DFS used', + 'dashboard.widgets.HDFSDiskUsage.nonDFSused': 'non DFS used', + 'dashboard.widgets.HDFSDiskUsage.remaining': 'remaining', + 'dashboard.widgets.HDFSDiskUsage.info': '{0} ({1}%)', 'dashboard.widgets.JobTrackerHeap': 'JobTracker Heap', 'dashboard.widgets.JobTrackerCpu': 'JobTracker CPU WIO', 'dashboard.widgets.JobTrackerCapacity': 'JobTracker Capacity', @@ -1661,8 +1665,11 @@ Em.I18n.translations = { 'dashboard.services.hdfs.nanmenode':'NameNode', 'dashboard.services.hdfs.snanmenode':'Secondary NameNode', 'dashboard.services.hdfs.journalnodes':'JournalNodes', - 'dashboard.services.hdfs.capacity':'HDFS Disk Capacity', - 'dashboard.services.hdfs.capacityUsed':'{0} / {1} ({2}% used)', + 'dashboard.services.hdfs.capacity':'HDFS Disk Usage', + 'dashboard.services.hdfs.capacity.dfsUsed':'Disk Usage (DFS Used)', + 'dashboard.services.hdfs.capacity.nonDfsUsed':'Disk Usage (Non DFS Used)', + 'dashboard.services.hdfs.capacity.remaining':'Disk Usage (Remaining)', + 'dashboard.services.hdfs.capacityUsed':'{0} / {1} ({2}%)', 'dashboard.services.hdfs.totalFilesAndDirs':'Total Files + Directories', 'dashboard.services.hdfs.datanodes':'DataNodes', 'dashboard.services.hdfs.datanodecounts':'DataNodes Status', http://git-wip-us.apache.org/repos/asf/ambari/blob/2efb7795/ambari-web/app/styles/application.less ---------------------------------------------------------------------- diff --git a/ambari-web/app/styles/application.less b/ambari-web/app/styles/application.less index 5fcc5e2..d376898 100644 --- a/ambari-web/app/styles/application.less +++ b/ambari-web/app/styles/application.less @@ -2447,8 +2447,8 @@ table.graphs { color: #000000; text-shadow: #fff 0px 0px 15px; position: relative; - left: -17px; - top: -7px; + left: -13px; + top: -10px; } .icon-edit{ color: #555555; @@ -2472,6 +2472,15 @@ table.graphs { } .hidden-info-five-line{ padding-top: 40px; + tr > td { + line-height: 18px; + } + } + .hidden-info-six-line{ + padding-top: 37px; + tr > td { + line-height: 16px; + } } .thumbnail .caption { padding-left: 0px; @@ -2557,23 +2566,28 @@ table.graphs { .slots-content-isNA{ top: -82px; } - .simple-text-hidden-two-line{ + .content-hidden-two-line{ top: -105px; opacity: 0.3; z-index: 5; } - .simple-text-hidden-three-line{ + .content-hidden-three-line{ top: -116px; opacity: 0.3; z-index: 5; } - .simple-text-hidden-four-line{ + .content-hidden-four-line{ top: -126px; opacity: 0.3; z-index: 5; } - .simple-text-hidden-five-line{ - top: -150px; + .content-hidden-five-line{ + top: -140px; + opacity: 0.3; + z-index: 5; + } + .content-hidden-six-line{ + top: -143px; opacity: 0.3; z-index: 5; } @@ -5348,6 +5362,9 @@ i.icon-asterisks { .thumbnail .hidden-info-five-line{ font-size: 12px; } + .thumbnail .hidden-info-six-line{ + font-size: 12px; + } .links .thumbnail .widget-content{ font-weight: bold; font-size: 12px; http://git-wip-us.apache.org/repos/asf/ambari/blob/2efb7795/ambari-web/app/templates/main/dashboard/service/hdfs.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/main/dashboard/service/hdfs.hbs b/ambari-web/app/templates/main/dashboard/service/hdfs.hbs index 6a0ae2e..5ace716 100644 --- a/ambari-web/app/templates/main/dashboard/service/hdfs.hbs +++ b/ambari-web/app/templates/main/dashboard/service/hdfs.hbs @@ -86,10 +86,18 @@ {{view.service.decommissionDataNodes.length}} {{t dashboard.services.hdfs.nodes.decom}} </td> </tr> - <!-- HDFS Capacity --> + <!-- HDFS Capacity (Disk Usage)--> <tr> - <td>{{t dashboard.services.hdfs.capacity}}</td> - <td>{{view.capacity}}</td> + <td>{{t dashboard.services.hdfs.capacity.dfsUsed}}</td> + <td>{{view.dfsUsedDisk}}</td> + </tr> + <tr> + <td>{{t dashboard.services.hdfs.capacity.nonDfsUsed}}</td> + <td>{{view.nonDfsUsedDisk}}</td> + </tr> + <tr> + <td>{{t dashboard.services.hdfs.capacity.remaining}}</td> + <td>{{view.remainingDisk}}</td> </tr> <!-- Blocks Total --> <tr> http://git-wip-us.apache.org/repos/asf/ambari/blob/2efb7795/ambari-web/app/templates/main/dashboard/widgets/pie_chart.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/main/dashboard/widgets/pie_chart.hbs b/ambari-web/app/templates/main/dashboard/widgets/pie_chart.hbs index cd5d099..b73a77c 100644 --- a/ambari-web/app/templates/main/dashboard/widgets/pie_chart.hbs +++ b/ambari-web/app/templates/main/dashboard/widgets/pie_chart.hbs @@ -27,21 +27,21 @@ <i class="icon-edit"></i> </a> - <div {{bindAttr class=":hidden-info-general view.hiddenInfoClass" }}> - <table align="center"> - {{#each line in view.hiddenInfo}} - <tr><td>{{line}}</td></tr> - {{/each}} - </table> - </div> + <div {{bindAttr class=":hidden-info-general view.hiddenInfoClass" }}> + <table align="center"> + {{#each line in view.hiddenInfo}} + <tr><td>{{line}}</td></tr> + {{/each}} + </table> + </div> - {{#if view.isPieExist}} - <div class="widget-content" > - {{view view.content modelBinding="view.model" thresh1Binding="view.thresh1" thresh2Binding="view.thresh2"}} - </div> - {{else}} - <div class="widget-content-isNA" >{{t services.service.summary.notAvailable}}</div> - {{/if}} + {{#if view.isPieExist}} + <div {{bindAttr class=":widget-content view.hoverContentTopClass"}}> + {{view view.content modelBinding="view.model" thresh1Binding="view.thresh1" thresh2Binding="view.thresh2"}} + </div> + {{else}} + <div class="widget-content-isNA" >{{t services.service.summary.notAvailable}}</div> + {{/if}} </li> </ul> </div> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ambari/blob/2efb7795/ambari-web/app/views/main/dashboard/service/hdfs.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/views/main/dashboard/service/hdfs.js b/ambari-web/app/views/main/dashboard/service/hdfs.js index aa06305..86a346a 100644 --- a/ambari-web/app/views/main/dashboard/service/hdfs.js +++ b/ambari-web/app/views/main/dashboard/service/hdfs.js @@ -140,17 +140,38 @@ App.MainDashboardServiceHdfsView = App.MainDashboardServiceView.extend({ return text.format(liveCount, totalCount, percent); }.property('service.dataNodes.@each.workStatus', 'service.capacityUsed', 'service.capacityTotal'), - capacity: function () { + dfsUsedDisk: function () { var text = this.t("dashboard.services.hdfs.capacityUsed"); var total = this.get('service.capacityTotal'); - var remaining = this.get('service.capacityRemaining'); - var used = total !== null && remaining !== null ? total - remaining : null; - var percent = total > 0 ? ((used * 100) / total).toFixed(1) : 0; + var dfsUsed = this.get('service.capacityUsed'); + var percent = total > 0 ? ((dfsUsed * 100) / total).toFixed(2) : 0; if (percent == "NaN" || percent < 0) { percent = Em.I18n.t('services.service.summary.notAvailable') + " "; } - return text.format(numberUtils.bytesToSize(used, 1, 'parseFloat'), numberUtils.bytesToSize(total, 1, 'parseFloat'), percent); + return text.format(numberUtils.bytesToSize(dfsUsed, 1, 'parseFloat'), numberUtils.bytesToSize(total, 1, 'parseFloat'), percent); }.property('service.capacityUsed', 'service.capacityTotal'), + nonDfsUsedDisk: function () { + var text = this.t("dashboard.services.hdfs.capacityUsed"); + var total = this.get('service.capacityTotal'); + var remaining = this.get('service.capacityRemaining'); + var dfsUsed = this.get('service.capacityUsed'); + var nonDfsUsed = total !== null && remaining !== null && dfsUsed !== null ? total - remaining - dfsUsed : null; + var percent = total > 0 ? ((nonDfsUsed * 100) / total).toFixed(2) : 0; + if (percent == "NaN" || percent < 0) { + percent = Em.I18n.t('services.service.summary.notAvailable') + " "; + } + return text.format(numberUtils.bytesToSize(nonDfsUsed, 1, 'parseFloat'), numberUtils.bytesToSize(total, 1, 'parseFloat'), percent); + }.property('service.capacityUsed', 'service.capacityRemaining', 'service.capacityTotal'), + remainingDisk: function () { + var text = this.t("dashboard.services.hdfs.capacityUsed"); + var total = this.get('service.capacityTotal'); + var remaining = this.get('service.capacityRemaining'); + var percent = total > 0 ? ((remaining * 100) / total).toFixed(2) : 0; + if (percent == "NaN" || percent < 0) { + percent = Em.I18n.t('services.service.summary.notAvailable') + " "; + } + return text.format(numberUtils.bytesToSize(remaining, 1, 'parseFloat'), numberUtils.bytesToSize(total, 1, 'parseFloat'), percent); + }.property('service.capacityRemaining', 'service.capacityTotal'), dataNodeComponent: function () { return this.get('service.dataNodes').objectAt(0); http://git-wip-us.apache.org/repos/asf/ambari/blob/2efb7795/ambari-web/app/views/main/dashboard/widget.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/views/main/dashboard/widget.js b/ambari-web/app/views/main/dashboard/widget.js index c68bff7..2fbaedf 100644 --- a/ambari-web/app/views/main/dashboard/widget.js +++ b/ambari-web/app/views/main/dashboard/widget.js @@ -233,20 +233,22 @@ App.DashboardWidgetView = Em.View.extend({ }, /** - * for simple-text template, + * for widgets has hidden info(hover info), * calculate the hover content top number * based on how long the hiddenInfo is */ hoverContentTopClass: function () { var lineNum = this.get('hiddenInfo.length'); if (lineNum == 2) { - return "simple-text-hidden-two-line"; + return "content-hidden-two-line"; } else if (lineNum == 3) { - return "simple-text-hidden-three-line"; + return "content-hidden-three-line"; } else if (lineNum == 4) { - return "simple-text-hidden-four-line"; + return "content-hidden-four-line"; } else if (lineNum == 5) { - return "simple-text-hidden-five-line"; + return "content-hidden-five-line"; + } else if (lineNum == 6) { + return "content-hidden-six-line"; } return ''; }.property('hiddenInfo.length') http://git-wip-us.apache.org/repos/asf/ambari/blob/2efb7795/ambari-web/app/views/main/dashboard/widgets/hdfs_capacity.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/views/main/dashboard/widgets/hdfs_capacity.js b/ambari-web/app/views/main/dashboard/widgets/hdfs_capacity.js index 5a256b7..81daa88 100644 --- a/ambari-web/app/views/main/dashboard/widgets/hdfs_capacity.js +++ b/ambari-web/app/views/main/dashboard/widgets/hdfs_capacity.js @@ -21,7 +21,7 @@ var numberUtils = require('utils/number_utils'); App.NameNodeCapacityPieChartView = App.PieChartDashboardWidgetView.extend({ - title: Em.I18n.t('dashboard.widgets.NameNodeCapacity'), + title: Em.I18n.t('dashboard.widgets.HDFSDiskUsage'), id: '2', model_type: 'hdfs', @@ -31,6 +31,7 @@ App.NameNodeCapacityPieChartView = App.PieChartDashboardWidgetView.extend({ */ modelFieldUsed: 'capacityRemaining', widgetHtmlId: 'widget-nn-capacity', + hiddenInfoClass: "hidden-info-six-line", didInsertElement: function() { this._super(); @@ -39,16 +40,28 @@ App.NameNodeCapacityPieChartView = App.PieChartDashboardWidgetView.extend({ calcHiddenInfo: function () { var total = this.get('model').get(this.get('modelFieldMax')) + 0; - var used = total - this.get('model').get(this.get('modelFieldUsed')) + 0; var remaining = this.get('model.capacityRemaining'); - var used = total !== null && remaining !== null ? total - remaining : null; - var percent = total > 0 ? ((used * 100) / total).toFixed(1) : 0; - if (percent == "NaN" || percent < 0) { - percent = Em.I18n.t('services.service.summary.notAvailable') + " "; + var dfsUsed = this.get('model.capacityUsed'); + var nonDfsUsed = total !== null && remaining !== null && dfsUsed !== null ? total - remaining - dfsUsed : null; + var dfsPercent = total > 0 ? ((dfsUsed * 100) / total).toFixed(2) : 0; + var nonDfsPercent = total > 0 ? ((nonDfsUsed * 100) / total).toFixed(2) : 0; + var remainingPercent = total > 0 ? ((remaining * 100) / total).toFixed(2) : 0; + if (dfsPercent == "NaN" || dfsPercent < 0) { + dfsPercent = Em.I18n.t('services.service.summary.notAvailable') + " "; + } + if (nonDfsPercent == "NaN" || nonDfsPercent < 0) { + nonDfsPercent = Em.I18n.t('services.service.summary.notAvailable') + " "; + } + if (remainingPercent == "NaN" || remainingPercent < 0) { + remainingPercent = Em.I18n.t('services.service.summary.notAvailable') + " "; } var result = []; - result.pushObject(percent + '% used'); - result.pushObject(numberUtils.bytesToSize(used, 1, 'parseFloat') + ' of ' + numberUtils.bytesToSize(total, 1, 'parseFloat')); + result.pushObject(Em.I18n.t('dashboard.widgets.HDFSDiskUsage.DFSused')); + result.pushObject(Em.I18n.t('dashboard.widgets.HDFSDiskUsage.info').format(numberUtils.bytesToSize(dfsUsed, 1, 'parseFloat'), dfsPercent)); + result.pushObject(Em.I18n.t('dashboard.widgets.HDFSDiskUsage.nonDFSused')); + result.pushObject(Em.I18n.t('dashboard.widgets.HDFSDiskUsage.info').format(numberUtils.bytesToSize(nonDfsUsed, 1, 'parseFloat'), nonDfsPercent)); + result.pushObject(Em.I18n.t('dashboard.widgets.HDFSDiskUsage.remaining')); + result.pushObject(Em.I18n.t('dashboard.widgets.HDFSDiskUsage.info').format(numberUtils.bytesToSize(remaining, 1, 'parseFloat'), remainingPercent)); return result; },