AMBARI-5454. Flume service summary page should show list of flume agents and status. (srimanth)

ambari-web/app/mappers/service_metrics_mapper.js

@@ -217,12 +217,13 @@ App.serviceMetricsMapper = App.QuickDataMapper.create({
           finalJson = this.flumeMapper(item);
           finalJson.rand = Math.random();
           result.push(finalJson);
-          if (finalJson.nodeObjs) {
+          // TODO Below block to be uncommented when server data available
+          /*if (finalJson.nodeObjs) {
             finalJson.nodeObjs.forEach(function (no) {
               App.store.load(App.FlumeNode, no);
             });
           }
-          App.store.load(App.FlumeService, finalJson);
+          App.store.load(App.FlumeService, finalJson);*/
         } else if (item && item.ServiceInfo && item.ServiceInfo.service_name == "YARN") {
           finalJson = this.yarnMapper(item);
           finalJson.rand = Math.random();

ambari-web/app/messages.js

@@ -1769,8 +1769,10 @@ Em.I18n.translations = {
   'dashboard.services.mapreduce.jobTrackerUptime':'Job Trackers Uptime',
   'dashboard.services.mapreduce.chart.label':'Jobs Running',
 
-  'dashboard.services.flume.summary.single':'{0} Flume Agent',
-  'dashboard.services.flume.summary.multiple':'{0} Flume Agents',
+  'dashboard.services.flume.summary.single':'{0} Flume Agent on ',
+  'dashboard.services.flume.summary.multiple':'{0} Flume Agents on ',
+  'dashboard.services.flume.summary.hosts.single':'1 host',
+  'dashboard.services.flume.summary.hosts.multiple':'{0} hosts',
   'dashboard.services.flume.agentsLabel': 'Flume Agents',
   'dashboard.services.flume.channels': 'Channels',
   'dashboard.services.flume.sources': 'Sources',

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

@@ -70,27 +70,222 @@ App.FlumeAgent = DS.Model.extend({
     } else {
       return sinks.split(',').length;
     }
-  }.property('sinks')
+  }.property('sinks'),
+
+  healthClass : function() {
+    switch (this.get('status')) {
+    case 'STARTED':
+    case 'STARTING':
+      return App.healthIconClassGreen;
+      break;
+    case 'INSTALLED':
+    case 'STOPPING':
+      return App.healthIconClassRed;
+      break;
+    case 'UNKNOWN':
+    default:
+      return App.healthIconClassYellow;
+      break;
+    }
+  }.property('status')
 });
 
-App.FlumeService.FIXTURES = [ {
-  version: '1.4.0',
-  agents: [ 0, 1 ]
-} ];
 App.FlumeAgent.FIXTURES = [ {
-  id: 0,
+  id: 1,
   name: 'a1_dev01',
   status: 'INSTALLED',
-  host: 'dev01',
+  host: 'dev01.hortonworks.com',
   channels: 'c1,c2',
   sources: 'so1,so2,so3,so4',
   sinks: 'si1,si2'
 }, {
-  id: 1,
+  id: 2,
   name: 'a2_dev01',
   status: 'STARTED',
-  host: 'dev01',
+  host: 'dev01.hortonworks.com',
+  channels: 'c2',
+  sources: 'so1,so2,so3,so4',
+  sinks: 'si1,si2,si3,si4'
+}, {
+  id: 3,
+  name: 'a3_dev01',
+  status: 'UNKNOWN',
+  host: 'dev01.hortonworks.com',
+  channels: 'c1, c4',
+  sources: 'so1',
+  sinks: 'si1,si2'
+}, {
+  id: 4,
+  name: 'a4_dev01',
+  status: 'UNKNOWN',
+  host: 'dev01.hortonworks.com',
+  channels: 'c1,c2',
+  sources: 'so1,so2,so3,so4',
+  sinks: 'si1,si2'
+}, {
+  id: 5,
+  name: 'a5_dev01',
+  status: 'STARTED',
+  host: 'dev01.hortonworks.com',
+  channels: 'c2',
+  sources: 'so1,so2,so3,so4',
+  sinks: 'si1,si2,si3,si4'
+}, {
+  id: 6,
+  name: 'a6_dev01',
+  status: 'STARTED',
+  host: 'dev01.hortonworks.com',
+  channels: 'c1, c4',
+  sources: 'so1',
+  sinks: 'si1,si2'
+}, {
+  id: 7,
+  name: 'a7_dev01',
+  status: 'INSTALLED',
+  host: 'dev01.hortonworks.com',
+  channels: 'c1,c2',
+  sources: 'so1,so2,so3,so4',
+  sinks: 'si1,si2'
+}, {
+  id: 8,
+  name: 'a8_dev01',
+  status: 'STARTED',
+  host: 'dev01.hortonworks.com',
+  channels: 'c2',
+  sources: 'so1,so2,so3,so4',
+  sinks: 'si1,si2,si3,si4'
+}, {
+  id: 9,
+  name: 'a9_dev01',
+  status: 'UNKNOWN',
+  host: 'dev01.hortonworks.com',
+  channels: 'c1, c4',
+  sources: 'so1',
+  sinks: 'si1,si2'
+}, {
+  id: 10,
+  name: 'a10_dev01',
+  status: 'UNKNOWN',
+  host: 'dev01.hortonworks.com',
+  channels: 'c1,c2',
+  sources: 'so1,so2,so3,so4',
+  sinks: 'si1,si2'
+}, {
+  id: 11,
+  name: 'a11_dev01',
+  status: 'STARTED',
+  host: 'dev01.hortonworks.com',
+  channels: 'c2',
+  sources: 'so1,so2,so3,so4',
+  sinks: 'si1,si2,si3,si4'
+}, {
+  id: 12,
+  name: 'a12_dev01',
+  status: 'STARTED',
+  host: 'dev01.hortonworks.com',
+  channels: 'c1, c4',
+  sources: 'so1',
+  sinks: 'si1,si2'
+}, {
+  id: 13,
+  name: 'a13_dev01',
+  status: 'INSTALLED',
+  host: 'dev01.hortonworks.com',
+  channels: 'c1,c2',
+  sources: 'so1,so2,so3,so4',
+  sinks: 'si1,si2'
+}, {
+  id: 14,
+  name: 'a14_dev01',
+  status: 'STARTED',
+  host: 'dev01.hortonworks.com',
   channels: 'c2',
   sources: 'so1,so2,so3,so4',
   sinks: 'si1,si2,si3,si4'
+}, {
+  id: 15,
+  name: 'a15_dev01',
+  status: 'UNKNOWN',
+  host: 'dev01.hortonworks.com',
+  channels: 'c1, c4',
+  sources: 'so1',
+  sinks: 'si1,si2'
+}, {
+  id: 16,
+  name: 'a16_dev01',
+  status: 'UNKNOWN',
+  host: 'dev01.hortonworks.com',
+  channels: 'c1,c2',
+  sources: 'so1,so2,so3,so4',
+  sinks: 'si1,si2'
+}, {
+  id: 17,
+  name: 'a17_dev01',
+  status: 'STARTED',
+  host: 'dev01.hortonworks.com',
+  channels: 'c2',
+  sources: 'so1,so2,so3,so4',
+  sinks: 'si1,si2,si3,si4'
+}, {
+  id: 18,
+  name: 'a18_dev01',
+  status: 'STARTED',
+  host: 'dev01.hortonworks.com',
+  channels: 'c1, c4',
+  sources: 'so1',
+  sinks: 'si1,si2'
+}, {
+  id: 19,
+  name: 'a19_dev01',
+  status: 'INSTALLED',
+  host: 'dev01.hortonworks.com',
+  channels: 'c1,c2',
+  sources: 'so1,so2,so3,so4',
+  sinks: 'si1,si2'
+}, {
+  id: 20,
+  name: 'a20_dev01',
+  status: 'STARTED',
+  host: 'dev01.hortonworks.com',
+  channels: 'c2',
+  sources: 'so1,so2,so3,so4',
+  sinks: 'si1,si2,si3,si4'
+}, {
+  id: 21,
+  name: 'a21_dev01',
+  status: 'UNKNOWN',
+  host: 'dev01.hortonworks.com',
+  channels: 'c1, c4',
+  sources: 'so1',
+  sinks: 'si1,si2'
+}, {
+  id: 22,
+  name: 'a22_dev01',
+  status: 'UNKNOWN',
+  host: 'dev01.hortonworks.com',
+  channels: 'c1,c2',
+  sources: 'so1,so2,so3,so4',
+  sinks: 'si1,si2'
+}, {
+  id: 23,
+  name: 'a23_dev01',
+  status: 'STARTED',
+  host: 'dev01.hortonworks.com',
+  channels: 'c2',
+  sources: 'so1,so2,so3,so4',
+  sinks: 'si1,si2,si3,si4'
+}, {
+  id: 24,
+  name: 'a24_dev01',
+  status: 'STARTED',
+  host: 'dev01.hortonworks.com',
+  channels: 'c1, c4',
+  sources: 'so1',
+  sinks: 'si1,si2'
+} ];
+App.FlumeService.FIXTURES = [ {
+  id: 0,
+  version: '1.4.0',
+  service_name: 'FLUME',
+  agents: [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24 ]
 } ];

ambari-web/app/styles/application.less

@@ -6057,3 +6057,34 @@ i.icon-asterisks {
   width:100%;
   min-height:600px;
 }
+
+#flume-summary {
+  text-align:left !important;
+  max-height: 490px;
+  overflow: scroll;
+  #flume-agents-table {
+    margin-top: 7px;
+    width: 100%;
+    td.agent-status {
+      width: 14px;
+      overflow: hidden;
+    }
+    td.agent-name {
+      width: 20%;
+      overflow: hidden;
+    }
+    td.agent-host-name {
+      width: 20%;
+      overflow: hidden;
+    }
+    .icon-ok-sign {
+      color: @health-status-green;
+    }
+    .icon-question-sign {
+      color: @health-status-yellow;
+    }
+    .icon-warning-sign {
+      color: #FDB82F;
+    }
+  }
+}

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

@@ -18,50 +18,57 @@
 
 <!-- Flume Agents -->
 <tr>
-  <td>{{t dashboard.services.flume.agentsLabel}}</td>
   <td>
+    <div id="flume-summary">
     <a href="#" {{action filterHosts view.flumeServerComponent}}>{{view.summaryHeader}}</a>
-  </td>
-</tr>
-<!-- Channels -->
-<tr>
-  <td>{{t dashboard.services.flume.channels}}</td>
-  <td>
-    {{view.service.channelsCount}} {{t dashboard.services.flume.channels}}
-    <ul>
-      {{#each view.service.nodes}}
-        {{#if channelsCount}}
-          <li> {{channels}} <a href="#" {{action showDetails host}}>{{host.publicHostName}}</a></li>
-        {{/if}}
-      {{/each}}
-    </ul>
-  </td>
-</tr>
-<!-- Sources -->
-<tr>
-  <td>{{t dashboard.services.flume.sources}}</td>
-  <td>
-    {{view.service.sourcesCount}} {{t dashboard.services.flume.sources}}
-    <ul>
-      {{#each view.service.nodes}}
-        {{#if sourcesCount}}
-          <li> {{sources}} <a href="#" {{action showDetails host}}>{{host.publicHostName}}</a></li>
-        {{/if}}
-      {{/each}}
-    </ul>
-  </td>
-</tr>
-<!-- Sinks -->
-<tr>
-  <td>{{t dashboard.services.flume.sinks}}</td>
-  <td>
-    {{view.service.sinksCount}} {{t dashboard.services.flume.sinks}}
-    <ul>
-      {{#each view.service.nodes}}
-        {{#if sinksCount}}
-          <li> {{sinks}} <a href="#" {{action showDetails host}}>{{host.publicHostName}}</a></li>
-        {{/if}}
+    <table class="table table-hover table-bordered table-striped" id="flume-agents-table">
+      <tr>
+        <th>
+        </th>
+        <th>
+          Agent
+        </th>
+        <th>
+          Host
+        </th>
+        <th>
+          Sources
+        </th>
+        <th>
+          Channels
+        </th>
+        <th>
+          Sinks
+        </th>
+        <th>
+          Actions
+        </th>
+      </tr>
+      {{#each agent in view.service.agents}}
+        <tr>
+          <td class="agent-status">
+            <span {{bindAttr class="agent.healthClass"}}></span>
+          </td>
+          <td class="agent-name">
+            {{agent.name}}
+          </td>
+          <td class="agent-host-name">
+            {{agent.host.hostName}}
+          </td>
+          <td>
+            {{agent.sourcesCount}}
+          </td>
+          <td>
+            {{agent.channelsCount}}
+          </td>
+          <td>
+            {{agent.sinksCount}}
+          </td>
+          <td>
+          </td>
+        </tr>
       {{/each}}
-    </ul>
+    </table>
+    </div>
   </td>
 </tr>

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

@@ -21,16 +21,19 @@ var date = require('utils/date');
 App.MainDashboardServiceFlumeView = App.MainDashboardServiceView.extend({
   templateName: require('templates/main/service/services/flume'),
   serviceName: 'flume',
-  
-  summaryHeader: function () {
-    var count = this.get('service.nodes.length');
-    if(count==1)
-      return this.t("dashboard.services.flume.summary.single").format(count);
-    return this.t("dashboard.services.flume.summary.multiple").format(count);
-  }.property('service.nodes'),
 
-  flumeServerComponent: function () {
-    return App.HostComponent.find().findProperty('componentName', 'FLUME_SERVER');
-  }.property()
+  summaryHeader : function() {
+    var agents = App.FlumeService.find().objectAt(0).get('agents');//this.get('service.agents');
+    var agentCount = agents.get('length');
+    var hostCount = agents.mapProperty('host').uniq().get('length');
+    var prefix = agentCount == 1 ? this.t("dashboard.services.flume.summary.single") :
+      this.t("dashboard.services.flume.summary.multiple").format(agentCount);
+    var suffix = hostCount == 1 ? this.t("dashboard.services.flume.summary.hosts.single") :
+      this.t("dashboard.services.flume.summary.hosts.multiple").format(hostCount);
+    return prefix + suffix;
+  }.property('service.agents'),
 
+  flumeServerComponent: function() {
+    return App.HostComponent.find().findProperty('componentName', 'FLUME_SERVER');
+  }.property(),
 });