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;
   },
 

Reply via email to