AMBARI-2793. YARN Memory widget needed on dashboard. (xiwang via yusaku)

ambari-web/app/mappers/service_mapper.js

@@ -78,7 +78,6 @@ App.servicesMapper = App.QuickDataMapper.create({
     dfs_total_files: 'nameNodeComponent.ServiceComponentInfo.TotalFiles',
     upgrade_status: 'nameNodeComponent.ServiceComponentInfo.UpgradeFinalized',
     safe_mode_status: 'nameNodeComponent.ServiceComponentInfo.Safemode',
-
     name_node_cpu: 'nameNodeComponent.host_components[0].metrics.cpu.cpu_wio',
     name_node_rpc: 'nameNodeComponent.host_components[0].metrics.rpc.RpcQueueTime_avg_time'
   },
@@ -105,9 +104,9 @@ App.servicesMapper = App.QuickDataMapper.create({
     node_managers_count_unhealthy: 'resourceManagerComponent.ServiceComponentInfo.rm_metrics.cluster.unhealthyNMcount',
     node_managers_count_rebooted: 'resourceManagerComponent.ServiceComponentInfo.rm_metrics.cluster.rebootedNMcount',
     node_managers_count_decommissioned: 'resourceManagerComponent.ServiceComponentInfo.rm_metrics.cluster.decommissionedNMcount',
-    allocated_memory: 'resourceManagerComponent.host_components[0].metrics.yarn.Queue.root.AllocatedMB',
+    yarn_memory_allocated: 'resourceManagerComponent.host_components[0].metrics.yarn.Queue.root.AllocatedMB',
+    yarn_memory_available: 'resourceManagerComponent.host_components[0].metrics.yarn.Queue.root.AvailableMB',
     reserved_memory: 'resourceManagerComponent.host_components[0].metrics.yarn.Queue.root.ReservedMB',
-    available_memory: 'resourceManagerComponent.host_components[0].metrics.yarn.Queue.root.AvailableMB',
     queue: 'resourceManagerComponent.queue'
   },
   mapReduce2Config: {
@@ -138,7 +137,6 @@ App.servicesMapper = App.QuickDataMapper.create({
     reduces_running: 'jobTrackerComponent.ServiceComponentInfo.jobtracker.running_reduces',
     reduces_waiting: 'jobTrackerComponent.ServiceComponentInfo.jobtracker.waiting_reduces',
     trackers_decommissioned: 'jobTrackerComponent.host_components[0].metrics.mapred.jobtracker.trackers_decommissioned',
-
     job_tracker_cpu: 'jobTrackerComponent.host_components[0].metrics.cpu.cpu_wio',
     job_tracker_rpc: 'jobTrackerComponent.host_components[0].metrics.rpc.RpcQueueTime_avg_time'
   },

ambari-web/app/messages.js

@@ -1182,6 +1182,7 @@ Em.I18n.translations = {
   'dashboard.widgets.ResourceManagerHeap': 'ResourceManager Heap',
   'dashboard.widgets.ResourceManagerUptime': 'ResourceManager Uptime',
   'dashboard.widgets.NodeManagersLive': 'NodeManagers Live',
+  'dashboard.widgets.YARNMemory': 'YARN Memory',
 
   'dashboard.services':'Services',
   'dashboard.services.hosts':'Hosts',

ambari-web/app/models/service/yarn.js

@@ -41,9 +41,9 @@ App.YARNService = App.Service.extend({
   resourceManagerStartTime: DS.attr('number'),
   jvmMemoryHeapUsed: DS.attr('number'),
   jvmMemoryHeapCommitted: DS.attr('number'),
-  allocatedMemory: DS.attr('number'),
+  //allocatedMemory: DS.attr('number'),
   reservedMemory: DS.attr('number'),
-  availableMemory: DS.attr('number'),
+  //availableMemory: DS.attr('number'),
   queue: DS.attr('string'),
   queueFormatted: function() {
     var queue = JSON.parse(this.get('queue'));
@@ -53,6 +53,8 @@ App.YARNService = App.Service.extend({
     var queue = JSON.parse(this.get('queue'));
     return objectUtils.recursiveKeysCount(queue);
   }.property('queue'),
+  yarnMemoryAllocated: DS.attr('number'),
+  yarnMemoryAvailable: DS.attr('number'),
   /** 
    * Provides a flat array of queue names.
    * Example: root, root/default

ambari-web/app/views.js

@@ -121,6 +121,7 @@ require('views/main/dashboard/widgets/hbase_master_uptime');
 require('views/main/dashboard/widgets/resource_manager_heap');
 require('views/main/dashboard/widgets/resource_manager_uptime');
 require('views/main/dashboard/widgets/node_managers_live');
+require('views/main/dashboard/widgets/yarn_memory');
 
 
 require('views/main/service');

ambari-web/app/views/main/dashboard.js

@@ -93,7 +93,7 @@ App.MainDashboardView = Em.View.extend({
       '18', '1', '6', '5', '9',
       '3', '7', '15', '16', '20',
       '19', '21', '23',
-      '24', '25', '26' // all yarn
+      '24', '25', '26', '27'// all yarn
     ]; // all in order
     var hiddenFull = [['22','Region In Transition']];
     if (this.get('hdfs_model') == null) {
@@ -118,7 +118,7 @@ App.MainDashboardView = Em.View.extend({
       }, this);
       hiddenFull = [];
     }if (this.get('yarn_model') == null) {
-      var yarn = ['24', '25', '26'];
+      var yarn = ['24', '25', '26', '27'];
       yarn.forEach ( function (item) {
         var index = visibleFull.indexOf(item);
         visibleFull.splice(index, 1);
@@ -275,6 +275,7 @@ App.MainDashboardView = Em.View.extend({
       case '24': return App.ResourceManagerHeapPieChartView;
       case '25': return App.ResourceManagerUptimeView;
       case '26': return App.NodeManagersLiveView;
+      case '27': return App.YARNMemoryPieChartView;
     }
   },
 
@@ -285,7 +286,7 @@ App.MainDashboardView = Em.View.extend({
     hidden: [],
     threshold: {1: [80, 90], 2: [85, 95], 3: [90, 95], 4: [80, 90], 5: [1000, 3000], 6: [70, 90], 7: [90, 95], 8: [50, 75], 9: [30000, 120000],
       10: [], 11: [], 12: [], 13: [], 14: [], 15: [], 16: [], 17: [], 18: [], 19: [], 20: [70, 90], 21: [10, 19.2], 22: [3, 10], 23: [],
-      24: [70, 90], 25: [], 26: [50, 75]} // id:[thresh1, thresh2]
+      24: [70, 90], 25: [], 26: [50, 75], 27: [50, 75]} // id:[thresh1, thresh2]
   }),
   persistKey: function () {
     var loginName = App.router.get('loginName');

ambari-web/app/views/main/dashboard/widgets/yarn_memory.js

@@ -0,0 +1,112 @@
+/**
+ * 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');
+var numberUtils = require('utils/number_utils');
+
+App.YARNMemoryPieChartView = App.DashboardWidgetView.extend({
+
+  templateName: require('templates/main/dashboard/widgets/pie_chart'),
+  title: Em.I18n.t('dashboard.widgets.YARNMemory'),
+  id: '27',
+
+  isPieChart: true,
+  isText: false,
+  isProgressBar: false,
+  model_type: 'yarn',
+
+  hiddenInfo: function () {
+    var memUsed = this.get('model').get('yarnMemoryAllocated');
+    var memCommitted = this.get('model').get('yarnMemoryAvailable');
+    var percent = memCommitted > 0 ? ((100 * memUsed) / memCommitted) : 0;
+    var result = [];
+    result.pushObject(percent.toFixed(1) + '% used');
+    result.pushObject(numberUtils.bytesToSize(memUsed, 1, 'parseFloat', 1024 * 1024) + ' of ' + numberUtils.bytesToSize(memCommitted, 1, 'parseFloat', 1024 * 1024));
+    return result;
+  }.property('model.yarnMemoryAllocated', 'model.yarnMemoryAvailable'),
+
+  thresh1: 40,// can be customized
+  thresh2: 70,
+  maxValue: 100,
+
+  isPieExist: function () {
+    var total = this.get('model.yarnMemoryAvailable');
+    return total > 0 ;
+  }.property('model.yarnMemoryAvailable'),
+
+  content: App.ChartPieView.extend({
+
+    model: null,  //data bind here
+    id: 'widget-yarn-memory', // id in html
+    stroke: '#D6DDDF', //light grey
+    thresh1: null,
+    thresh2: null,
+    innerR: 25,
+
+    existCenterText: true,
+    centerTextColor: function () {
+      return this.get('contentColor');
+    }.property('contentColor'),
+
+    palette: new Rickshaw.Color.Palette({
+      scheme: [ '#FFFFFF', '#D6DDDF'].reverse()
+    }),
+
+    data: function () {
+      var memUsed = this.get('model').get('yarnMemoryAllocated') * 1000000;
+      var memCommitted = this.get('model').get('yarnMemoryAvailable') * 1000000;
+      var percent = memCommitted > 0 ? ((100 * memUsed) / memCommitted).toFixed() : 0;
+      return [ percent, 100 - percent];
+    }.property('model.yarnMemoryAllocated', 'model.yarnMemoryAvailable'),
+
+    contentColor: function (){
+      var used = parseFloat(this.get('data')[0]);
+      var thresh1 = parseFloat(this.get('thresh1'));
+      var thresh2 = parseFloat(this.get('thresh2'));
+      var color_green = '#95A800';
+      var color_red = '#B80000';
+      var color_orange = '#FF8E00';
+      if (used <= thresh1) {
+        this.set('palette', new Rickshaw.Color.Palette({
+          scheme: [ '#FFFFFF', color_green  ].reverse()
+        }))
+        return color_green;
+      } else if (used <= thresh2) {
+        this.set('palette', new Rickshaw.Color.Palette({
+          scheme: [ '#FFFFFF', color_orange  ].reverse()
+        }))
+        return color_orange;
+      } else {
+        this.set('palette', new Rickshaw.Color.Palette({
+          scheme: [ '#FFFFFF', color_red  ].reverse()
+        }))
+        return color_red;
+      }
+    }.property('data', 'this.thresh1', 'this.thresh2'),
+
+    refreshSvg: function () {
+      // remove old svg
+      var old_svg =  $("#" + this.id);
+      old_svg.remove();
+
+      // draw new svg
+      this.appendSvg();
+    }.observes('this.data', 'this.thresh1', 'this.thresh2')
+  })
+
+})