AMBARI-5519. Selecting agent should show source/channel/sink metrics in each section. (srimanth)

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

@@ -41,7 +41,7 @@ App.FlumeAgent = DS.Model.extend({
 
   healthClass : function() {
     switch (this.get('status')) {
-    case 'STARTED':
+    case 'RUNNING':
     case 'STARTING':
       return App.healthIconClassGreen;
       break;

ambari-web/app/templates/main/service/info/metric_graphs.hbs

@@ -0,0 +1,13 @@
+<table class="graphs">
+  {{#each graphs in view.serviceMetricGraphs}}
+    <tr>
+      {{#each graph in graphs}}
+        <td>
+          <div class="">
+            {{view graph}}
+          </div>
+        </td>
+      {{/each}}
+    </tr>
+  {{/each}}
+</table>

ambari-web/app/templates/main/service/info/summary.hbs

@@ -142,7 +142,7 @@
             <div class="accordion-body collapse in" {{bindAttr id="collapsedSection.id"}}>
               <div class="accordion-inner">
                 {{#if collapsedSection.metricView}}
-                  {{view collapsedSection.metricView}}
+                  {{view collapsedSection.metricView viewDataBinding="collapsedSection.metricViewData"}}
                 {{/if}}
               </div>
             </div>

ambari-web/app/utils/ajax/ajax.js

@@ -2067,6 +2067,19 @@ var urls = {
   'views.instances': {
     'real': '/views/{viewName}',
     'mock':''
+  },
+  'host.host_component.flume.metrics': {
+    'real': '/clusters/{clusterName}/hosts/{hostName}/host_components/FLUME_HANDLER?fields=metrics/flume/flume/{flumeComponent}/*',
+    'mock': '',
+    'format': function(data) {
+      return {
+        async: data.async
+      }
+    }
+  },
+  'host.host_component.flume.metrics.timeseries': {
+    'real': '/clusters/{clusterName}/hosts/{hostName}/host_components/FLUME_HANDLER?fields=metrics/flume/flume/{flumeComponent}/*/{flumeComponentMetric}[{fromSeconds},{toSeconds},{stepSeconds}]',
+    'mock': ''
   }
 };
 /**

ambari-web/app/views.js

@@ -163,6 +163,7 @@ require('views/main/service/reconfigure');
 require('views/main/service/info/menu');
 require('views/main/service/info/summary');
 require('views/main/service/info/configs');
+require('views/main/service/info/metric_graphs_view');
 require('views/main/service/info/metrics/hdfs/jvm_threads');
 require('views/main/service/info/metrics/hdfs/jvm_heap');
 require('views/main/service/info/metrics/hdfs/io');
@@ -204,6 +205,8 @@ require('views/main/service/info/metrics/flume/gc');
 require('views/main/service/info/metrics/flume/jvm_heap');
 require('views/main/service/info/metrics/flume/jvm_threads_runnable');
 require('views/main/service/info/metrics/flume/cpu_user');
+require('views/main/service/info/metrics/flume/flume_metric_graph');
+require('views/main/service/info/metrics/flume/flume_metric_graphs');
 require('views/main/service/info/metrics/storm/slots_number_metric');
 require('views/main/service/info/metrics/storm/executors_metric');
 require('views/main/service/info/metrics/storm/tasks_metric');

ambari-web/app/views/main/service/info/metric_graphs_view.js

@@ -0,0 +1,33 @@
+/**
+ * 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/service');
+
+App.MainServiceInfoSummaryMetricGraphsView = Em.View.extend({
+  templateName: require('templates/main/service/info/metric_graphs'),
+
+  /**
+   * Data used by this view which is set from the template.
+   */
+  viewData: null,
+
+  /**
+   * Contains graphs for this particular service
+   */
+  serviceMetricGraphs: null
+});

ambari-web/app/views/main/service/info/metrics/flume/flume_metric_graph.js

@@ -0,0 +1,78 @@
+/**
+ * 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');
+
+/**
+ * @class
+ *
+ * This is a view for showing individual graphs of Flume.
+ *
+ * @extends App.ChartLinearTimeView
+ * @extends Ember.Object
+ * @extends Ember.View
+ */
+App.ChartServiceFlumeMetricGraph = App.ChartLinearTimeView.extend({
+  /**
+   * One of 'SOURCE', 'SINK' or 'CHANNEL'.
+   */
+  metricType: null,
+  metricName: null,
+  hostName: null,
+
+  id: function(){
+    return "service-metrics-flume-metric-graph-" + this.get('metricType') + '-' + this.get('metricType');
+  }.property('metricType', 'metricName'),
+
+  title: function(){
+    return this.get('metricName');
+  }.property('metricName'),
+
+  ajaxIndex: 'host.host_component.flume.metrics.timeseries',
+
+  getDataForAjaxRequest: function() {
+    var data = this._super();
+    data.flumeComponentMetric = this.get('metricName');
+    data.flumeComponent = this.get('metricType');
+    data.hostName = this.get('hostName');
+    return data;
+  },
+
+  transformToSeries: function (jsonData) {
+    var seriesArray = [];
+    var self = this;
+    if (jsonData && jsonData.host_components) {
+      jsonData.host_components.forEach(function (hc) {
+        var hostName = hc.HostRoles.host_name;
+        var host = App.Host.find(hostName);
+        if (host && host.get('publicHostName')) {
+          hostName = host.get('publicHostName');
+        }
+        if (hc.metrics && hc.metrics.flume && hc.metrics.flume.flume && hc.metrics.flume.flume.SINK) {
+          for ( var cname in hc.metrics.flume.flume.SINK) {
+            var seriesName = Em.I18n.t('services.service.info.metrics.flume.sinkName').format(cname + " (" + hostName + ")");
+            var seriesData = hc.metrics.flume.flume.SINK[cname]['ConnectionFailedCount'];
+            if (seriesData) {
+              seriesArray.push(self.transformData(seriesData, seriesName));
+            }
+          }
+        }
+      });
+    }
+    return seriesArray;
+  }
+});

ambari-web/app/views/main/service/info/metrics/flume/flume_metric_graphs.js

@@ -0,0 +1,69 @@
+/**
+ * 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/service');
+
+App.MainServiceInfoFlumeGraphsView = App.MainServiceInfoSummaryMetricGraphsView.extend({
+
+  serviceMetricGraphs: function() {
+    var graphRows = [];
+    var viewData = this.get('viewData');
+    if (viewData != null) {
+      var metricType = viewData.metricType;
+      var hostName = viewData.agent.get('host.hostName');
+      var metricNamesGatherer = {
+        success: function(data) {
+          var graphs = [];
+          var metricNames = {};
+          if (data != null && data.metrics != null && data.metrics.flume != null && data.metrics.flume.flume != null && data.metrics.flume.flume[metricType] != null) {
+            for ( var name in data.metrics.flume.flume[metricType]) {
+              for ( var metricName in data.metrics.flume.flume[metricType][name]) {
+                metricNames[metricName] = name;
+              }
+            }
+          }
+          // Now that we have collected all metric names, we create
+          // views for each of them.
+          for ( var metricName in metricNames) {
+            graphs.push(App.ChartServiceFlumeMetricGraph.extend({
+              metricType: metricType,
+              metricName: metricName,
+              hostName: hostName
+            }));
+            if (graphs.length > 3) {
+              graphRows.push(graphs);
+              graphs = [];
+            }
+          }
+        }
+      }
+      App.ajax.send({
+        'name': 'host.host_component.flume.metrics',
+        'sender': metricNamesGatherer,
+        'success': 'success',
+        'data': {
+          async: false,
+          hostName: hostName,
+          flumeComponent: metricType
+        }
+      });
+    }
+    return graphRows;
+  }.property('viewData', 'metricType')
+
+});

ambari-web/app/views/main/service/services/flume.js

@@ -145,15 +145,27 @@ App.MainDashboardServiceFlumeView = App.TableView.extend({
     var mockMetricData = [
       {
         header: 'sinkName',
-        metricView: App.ChartServiceMetricsFlume_SinkDrainSuccessCount.extend()
+        metricView: App.MainServiceInfoFlumeGraphsView.extend(),
+        metricViewData: {
+          agent: agent,
+          metricType: 'SINK'
+        }
       },
       {
         header: 'sourceName',
-        metricView: App.ChartServiceMetricsFlume_SourceAcceptedCount.extend()
+        metricView: App.MainServiceInfoFlumeGraphsView.extend(),
+        metricViewData: {
+          agent: agent,
+          metricType: 'SOURCE'
+        }
       },
       {
         header: 'channelName',
-        metricView: App.ChartServiceMetricsFlume_ChannelSize.extend()
+        metricView: App.MainServiceInfoFlumeGraphsView.extend(),
+        metricViewData: {
+          agent: agent,
+          metricType: 'CHANNEL'
+        }
       }
     ];
     mockMetricData.forEach(function(mockData, index) {