AMBARI-5506. Flume agents should have actions to stop/start each agent. (akovalenko)

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

@@ -20,6 +20,74 @@ var App = require('app');
 App.MainServiceInfoSummaryController = Em.Controller.extend({
   name: 'mainServiceInfoSummaryController',
 
+  selectedFlumeAgent: null,
+
+  /**
+   * Send start command for selected Flume Agent
+   * @method startFlumeAgent
+   */
+  startFlumeAgent: function () {
+    var selectedFlumeAgent = this.get('selectedFlumeAgent');
+    if (selectedFlumeAgent && selectedFlumeAgent.get('status') === 'INSTALLED') {
+      var self = this;
+      App.showConfirmationPopup(function () {
+        var command = 'START';
+        var context = Em.I18n.t('services.service.summary.flume.start.context').format(selectedFlumeAgent.get('name'));
+        self.sendFlumeAgentCommandToServer(command, context, selectedFlumeAgent);
+      });
+    }
+  },
+
+  /**
+   * Send stop command for selected Flume Agent
+   * @method stopFlumeAgent
+   */
+  stopFlumeAgent: function () {
+    var selectedFlumeAgent = this.get('selectedFlumeAgent');
+    if (selectedFlumeAgent && selectedFlumeAgent.get('status') === 'STARTED') {
+      var self = this;
+      App.showConfirmationPopup(function () {
+        var command = 'STOP';
+        var context = Em.I18n.t('services.service.summary.flume.stop.context').format(selectedFlumeAgent.get('name'));
+        self.sendFlumeAgentCommandToServer(command, context, selectedFlumeAgent);
+      });
+    }
+  },
+
+  /**
+   * Send command for Flume Agent to server
+   * @param {string} command
+   * @param {string} context
+   * @param {Object} agent
+   * @method sendFlumeAgentCommandToServer
+   */
+  sendFlumeAgentCommandToServer: function (command, context, agent) {
+    App.ajax.send({
+      name: 'service.flume.agent.command',
+      sender: this,
+      data: {
+        command: command,
+        context: context,
+        agentName: agent.get('name'),
+        host: agent.get('host.hostName')
+      },
+      success: 'commandSuccessCallback'
+    });
+  },
+
+  /**
+   * Callback, that shows Background operations popup if request was successful
+   */
+  commandSuccessCallback: function () {
+    console.log('Send request for refresh configs successfully');
+    // load data (if we need to show this background operations popup) from persist
+    App.router.get('applicationController').dataLoading().done(function (showPopup) {
+      if (showPopup) {
+        App.router.get('backgroundOperationsController').showPopup();
+      }
+    });
+  },
+
   nagiosUrl: function(){
     return App.router.get('clusterController.nagiosUrl');
   }.property('App.router.clusterController.nagiosUrl'),

ambari-web/app/messages.js

@@ -1100,6 +1100,10 @@ Em.I18n.translations = {
   'services.service.summary.storm.tasks': 'Tasks',
   'services.service.summary.storm.nimbus.uptime': 'Nimbus uptime',
   'services.service.summary.storm.topologies': 'Topologies',
+  'services.service.summary.flume.startAgent': 'Start Agent',
+  'services.service.summary.flume.stopAgent': 'Stop Agent',
+  'services.service.summary.flume.stop.context': 'Stop Flume Agent {0}',
+  'services.service.summary.flume.start.context': 'Start Flume Agent {0}',
 
   'services.service.info.metrics.flume.channelFillPercent':'Channel Fill Percentage',
   'services.service.info.metrics.flume.channelSize':'Channel Size',

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

@@ -60,7 +60,11 @@
               {{template "templates/main/service/info/summary/hue"}}
             {{/if}}
             {{#if view.serviceStatus.flume}}
-              {{view App.MainDashboardServiceFlumeView serviceBinding="view.service"}}
+              <tr>
+                <td>
+                  {{view App.MainDashboardServiceFlumeView serviceBinding="view.service"}}
+                </td>
+              </tr>
             {{/if}}
             {{#if view.serviceStatus.falcon}}
               {{template "templates/main/service/info/summary/falcon"}}

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

@@ -17,49 +17,63 @@
 }}
 
 <!-- Flume Agents -->
-<tr>
-  <td>
     <div id="flume-summary">
-    <a href="#" {{action filterHosts view.flumeHandlerComponent}}>{{view.summaryHeader}}</a>
-    <table class="table table-hover table-bordered table-striped" id="flume-agents-table">
-      <thead>
-      {{#view view.sortView contentBinding="view.filteredContent" class="label-row"}}
-        {{view view.parentView.statusSort}}
-        {{view view.parentView.agentSort}}
-        {{view view.parentView.hostSort}}
-        {{view view.parentView.sourceSort}}
-        {{view view.parentView.channelSort}}
-        {{view view.parentView.sinkSort}}
-        <td></td>
-      {{/view}}
-      </thead>
-      <tbody>
-      {{#each agent in view.pageContent}}
-        <tr {{action showAgentInfo agent target="view"}}>
-          <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}}
-      </tbody>
-    </table>
+      <a href="#" {{action filterHosts view.flumeHandlerComponent}}>{{view.summaryHeader}}</a>
+        <div class="btn-group display-inline-block flume-agents-actions pull-right">
+          <a {{bindAttr class=":btn :dropdown-toggle view.isActionsDisabled:disabled"}} data-toggle="dropdown" href="javascript:void(null)">{{t common.actions}}
+            <span class="caret"></span>
+          </a>
+          <ul class="pull-left dropdown-menu">
+            <li {{bindAttr class="view.isStartAgentDisabled:disabled"}}>
+              <a href="javascript:void(null)"
+                      {{bindAttr class="view.isStartAgentDisabled:disabled"}}
+                      {{action startFlumeAgent target="controller"}}>
+                {{t services.service.summary.flume.startAgent}}</a>
+            </li>
+            <li {{bindAttr class="view.isStopAgentDisabled:disabled"}}>
+              <a href="javascript:void(null)"
+                      {{bindAttr class="view.isStopAgentDisabled:disabled"}}
+                      {{action stopFlumeAgent target="controller"}}>
+                {{t services.service.summary.flume.stopAgent}}</a>
+            </li>
+          </ul>
+        </div>
+      <div class="scrollable-container">
+        <table class="table table-hover table-bordered table-striped" id="flume-agents-table">
+          <thead>
+          {{#view view.sortView contentBinding="view.filteredContent" class="label-row"}}
+            {{view view.parentView.statusSort}}
+            {{view view.parentView.agentSort}}
+            {{view view.parentView.hostSort}}
+            {{view view.parentView.sourceSort}}
+            {{view view.parentView.channelSort}}
+            {{view view.parentView.sinkSort}}
+          {{/view}}
+          </thead>
+          <tbody>
+          {{#each agent in view.pageContent}}
+            <tr {{action showAgentInfo agent target="view"}}>
+              <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>
+            </tr>
+          {{/each}}
+          </tbody>
+        </table>
+      </div>
     </div>
-  </td>
-</tr>

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

@@ -141,6 +141,29 @@ var urls = {
     'real': '/clusters/{clusterName}/config_groups?ConfigGroup/tag={serviceName}&fields=*',
     'mock': '/data/configurations/config_group.json'
   },
+  'service.flume.agent.command': {
+    'real': '/clusters/{clusterName}/requests',
+    'mock': '',
+    'format': function (data) {
+      return {
+        type: 'POST',
+        data: JSON.stringify({
+          "RequestInfo": {
+            "command": data.command,
+            "context": data.context,
+            "flume_handler": data.agentName
+          },
+          "Requests/resource_filters": [
+            {
+              "service_name": "FLUME",
+              "component_name": "FLUME_HANDLER",
+              "hosts": data.host
+            }
+          ]
+        })
+      }
+    }
+  },
   'reassign.stop_services': {
     'real': '/clusters/{clusterName}/services',
     'mock': '',

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

@@ -24,6 +24,12 @@ App.MainDashboardServiceFlumeView = App.TableView.extend({
 
   pagination: false,
 
+  isActionsDisabled: true,
+
+  isStartAgentDisabled: true,
+
+  isStopAgentDisabled: true,
+
   content: function () {
     return this.get('service.agents');
   }.property('service.agents.length'),
@@ -82,8 +88,22 @@ App.MainDashboardServiceFlumeView = App.TableView.extend({
   }),
 
   didInsertElement: function () {
+    this.set('controller.selectedFlumeAgent', null);
     this.filter();
   },
+
+  /**
+   * Change classes for dropdown DOM elements after status change of selected agent
+   */
+  setActionsDropdownClasses: function () {
+    var selectedFlumeAgent = this.get('controller.selectedFlumeAgent');
+    this.set('isActionsDisabled', !selectedFlumeAgent);
+    if (selectedFlumeAgent) {
+      this.set('isStartAgentDisabled', selectedFlumeAgent.get('status') !== 'INSTALLED');
+      this.set('isStopAgentDisabled', selectedFlumeAgent.get('status') !== 'STARTED');
+    }
+  }.observes('controller.selectedFlumeAgent', 'controller.selectedFlumeAgent.status'),
+
   /**
    * Action handler from flume tepmlate.
    * Highlight selected row and show metrics graphs of selected agent.
@@ -91,9 +111,11 @@ App.MainDashboardServiceFlumeView = App.TableView.extend({
    * @method showAgentInfo
    * @param {object} event
    */
-  showAgentInfo: function(event){
+  showAgentInfo: function (event) {
+    var agent = event.context;
+    this.set('controller.selectedFlumeAgent', agent);
     this.toggleHighlight($(event.currentTarget));
-    this.get('parentView').setMetric(event.context);
+    this.get('parentView').setMetric(agent);
   },
   /**
    * Highlight current row and remove highlight from previously selected item.