AMBARI-5491. Flume agent should be selectable in agents table. (Denys Buzhor via akovalenko)

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

@@ -123,7 +123,7 @@
   <div class="span12">
     <div class="box">
       <div class="box-header">
-        <h4>{{controller.content.label}} {{t common.metrics}}</h4>
+      <h4>{{controller.content.label}} {{formatNull view.metricsHeader empty="t:common.metrics"}}</h4>
         {{#if controller.isGangliaInstalled}}
           <div class="btn-group">
             <a class="btn" target="_blank" rel="tooltip" title="Go to Ganglia" {{bindAttr href="view.gangliaUrl"}}><i class="icon-link"></i></a>

ambari-web/app/templates/main/service/services/flume.hbs

@@ -35,7 +35,7 @@
       </thead>
       <tbody>
       {{#each agent in view.pageContent}}
-        <tr>
+        <tr {{action showAgentInfo agent target="view"}}>
           <td class="agent-status">
             <span {{bindAttr class="agent.healthClass"}}></span>
           </td>

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

@@ -54,6 +54,8 @@ App.MainServiceInfoSummaryView = Em.View.extend({
     pig :false,
     sqoop: false
   },
+  /** @property metricsHeader {string} - custom metrics title **/
+  metricsHeader: null,
 
   servicesHaveClients: ["OOZIE", "ZOOKEEPER", "HIVE", "MAPREDUCE2", "TEZ", "SQOOP", "PIG","FALCON"],
 
@@ -518,5 +520,30 @@ App.MainServiceInfoSummaryView = Em.View.extend({
     });
 
     return names.length ? names.join(', ') : false;
-  }.property('clientComponents')
+  }.property('clientComponents'),
+  /**
+   * Show metric by related info.
+   *
+   * @method setMetric
+   * @param {object} context - data related to metric
+   */
+  setMetric: function(context) {
+    switch (this.get('service.serviceName')) {
+      case 'FLUME':
+        this.setFlumeAgentMetric(context);
+        break;
+      default:
+        break;
+    }
+  },
+  /**
+   * Show Flume agent metric.
+   *
+   * @method setFlumeAgentMetric
+   * @param {object} agent - DS.model of agent
+   */
+  setFlumeAgentMetric: function(agent) {
+    this.set('metricsHeader', Em.I18n.t('common.metrics') + " - " + agent.get('name'));
+  }
+
 });

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

@@ -83,5 +83,26 @@ App.MainDashboardServiceFlumeView = App.TableView.extend({
 
   didInsertElement: function () {
     this.filter();
+  },
+  /**
+   * Action handler from flume tepmlate.
+   * Highlight selected row and show metrics graphs of selected agent.
+   *
+   * @method showAgentInfo
+   * @param {object} event
+   */
+  showAgentInfo: function(event){
+    this.toggleHighlight($(event.currentTarget));
+    this.get('parentView').setMetric(event.context);
+  },
+  /**
+   * Highlight current row and remove highlight from previously selected item.
+   *
+   * @method toggleHighlight
+   * @param {object} element - jQuery object
+   */
+  toggleHighlight: function(element) {
+    element.parent().find('.highlight').removeClass('highlight');
+    element.addClass('highlight');
   }
 });