AMBARI-8547. Alerts UI: Create Alert Definition Wizard. Step-3 POST-call (onechiporenko)

ambari-web/app/controllers/main/alerts/add_alert_definition/add_alert_definition_controller.js

@@ -28,6 +28,21 @@ App.AddAlertDefinitionController = App.WizardController.extend({
     selectedType: null
   },
 
+  /**
+   * Do request to create new alert definition
+   * @param {object} newDefinitionData
+   * @returns {$.ajax}
+   */
+  createNewAlertDefinition: function (newDefinitionData) {
+    return App.ajax.send({
+      name: 'alerts.create_alert_definition',
+      sender: this,
+      data: {
+        data: newDefinitionData
+      }
+    });
+  },
+
   finish: function() {
     this.clear();
     this.setCurrentStep('1');

ambari-web/app/controllers/main/alerts/definition_configs_controller.js

@@ -392,19 +392,21 @@ App.MainAlertDefinitionConfigsController = Em.Controller.extend({
       sender: this,
       data: {
         id: this.get('content.id'),
-        data: this.getPropertiesToUpdate()
+        data: this.getPropertiesToUpdate(true)
       }
     });
   },
 
   /**
    * Create object with new values to put it on server
+   * @param {boolean} onlyChanged
    * @method getPropertiesToUpdate
    * @returns {Object}
    */
-  getPropertiesToUpdate: function () {
+  getPropertiesToUpdate: function (onlyChanged) {
     var propertiesToUpdate = {};
-    this.get('configs').filterProperty('wasChanged').forEach(function (property) {
+    var configs = onlyChanged ? this.get('configs').filterProperty('wasChanged') : this.get('configs');
+    configs.forEach(function (property) {
       var apiProperties = property.get('apiProperty');
       var apiFormattedValues = property.get('apiFormattedValue');
       if (!Em.isArray(property.get('apiProperty'))) {
@@ -414,21 +416,35 @@ App.MainAlertDefinitionConfigsController = Em.Controller.extend({
       apiProperties.forEach(function (apiProperty, i) {
         if (apiProperty.contains('source.')) {
           if (!propertiesToUpdate['AlertDefinition/source']) {
-            propertiesToUpdate['AlertDefinition/source'] = this.get('content.rawSourceData');
+            if (this.get('content.rawSourceData')) {
+              propertiesToUpdate['AlertDefinition/source'] = this.get('content.rawSourceData');
+            }
           }
 
-          var sourcePath = propertiesToUpdate['AlertDefinition/source'];
-          apiProperty.replace('source.', '').split('.').forEach(function (path, index, array) {
-            // check if it is last path
-            if (array.length - index === 1) {
-              sourcePath[path] = apiFormattedValues[i];
-            } else {
-              sourcePath = sourcePath[path];
+          if (this.get('content.rawSourceData')) {
+            // use rawSourceData to populate propertiesToUpdate
+            var sourcePath = propertiesToUpdate['AlertDefinition/source'];
+            apiProperty.replace('source.', '').split('.').forEach(function (path, index, array) {
+              // check if it is last path
+              if (array.length - index === 1) {
+                sourcePath[path] = apiFormattedValues[i];
+              } else {
+                sourcePath = sourcePath[path];
+              }
+            });
+          }
+          else {
+            if (!propertiesToUpdate['AlertDefinition/source']) {
+              propertiesToUpdate['AlertDefinition/source'] = {};
             }
-          });
+            Ember.setFullPath(propertiesToUpdate['AlertDefinition/source'], apiProperty.replace('source.', ''), apiFormattedValues[i]);
+          }
 
-        } else {
-          propertiesToUpdate['AlertDefinition/' + apiProperty] = apiFormattedValues[i];
+        }
+        else {
+          if (apiProperty) {
+            propertiesToUpdate['AlertDefinition/' + apiProperty] = apiFormattedValues[i];
+          }
         }
       }, this);
     }, this);
@@ -439,6 +455,7 @@ App.MainAlertDefinitionConfigsController = Em.Controller.extend({
   /**
    * Return array of all config values
    * used to save configs to local db in wizard
+   * @method getConfigsValues
    * @returns {Array}
    */
   getConfigsValues: function () {

ambari-web/app/messages.js

@@ -844,6 +844,7 @@ Em.I18n.translations = {
   'alerts.add.step1.header': 'Choose Type',
   'alerts.add.step2.header': 'Configure',
   'alerts.add.step3.header': 'Review',
+  'alerts.add.step3.selectedType': 'Selected Type',
 
   'alerts.fastAccess.popup.header': '{0} Critical or Warning Alerts',
   'alerts.fastAccess.popup.body.name': 'Alert Name',

ambari-web/app/routes/add_alert_definition_routes.js

@@ -95,7 +95,12 @@ module.exports = App.WizardRoute.extend({
 
     next: function (router) {
       var controller = router.get('addAlertDefinitionController');
-      controller.set('content.configs', App.router.get('mainAlertDefinitionConfigsController').getConfigsValues());
+      controller.set('content.configs', App.router.get('mainAlertDefinitionConfigsController.configs'));
+      var newDefinitionData = App.router.get('mainAlertDefinitionConfigsController').getPropertiesToUpdate(false);
+      newDefinitionData['AlertDefinition/source'].type = controller.get('content.selectedType');
+      newDefinitionData['AlertDefinition/label'] = newDefinitionData['AlertDefinition/name'];
+      newDefinitionData['AlertDefinition/name'] = newDefinitionData['AlertDefinition/name'].toLowerCase().replace(/\s+/g, '_');
+      controller.set('content.formattedToRequestConfigs', newDefinitionData);
       controller.setDBProperty('content', controller.get('content'));
       router.transitionTo('step3');
     }
@@ -109,6 +114,7 @@ module.exports = App.WizardRoute.extend({
     connectOutlets: function (router) {
       var controller = router.get('addAlertDefinitionController');
       controller.setCurrentStep('3');
+      controller.set('content', controller.getDBProperty('content'));
       controller.connectOutlet('addAlertDefinitionStep3', controller.get('content'));
     },
 
@@ -116,21 +122,23 @@ module.exports = App.WizardRoute.extend({
 
     done: function (router) {
       var controller = router.get('addAlertDefinitionController');
-      controller.get('popup').hide();
-      controller.setDBProperty('content', {});
-      controller.finish();
-      App.clusterStatus.setClusterStatus({
-          clusterName: controller.get('content.cluster.name'),
-          clusterState: 'DEFAULT',
-          localdb: App.db.data
-        },
-        {
-          alwaysCallback: function () {
-            controller.get('popup').hide();
-            router.transitionTo('main.alerts');
-            location.reload();
-          }
-        });
+      controller.createNewAlertDefinition(Em.get(controller.getDBProperty('content'), 'formattedToRequestConfigs')).done(function () {
+        controller.get('popup').hide();
+        controller.setDBProperty('content', {});
+        controller.finish();
+        App.clusterStatus.setClusterStatus({
+            clusterName: controller.get('content.cluster.name'),
+            clusterState: 'DEFAULT',
+            localdb: App.db.data
+          },
+          {
+            alwaysCallback: function () {
+              controller.get('popup').hide();
+              router.transitionTo('main.alerts');
+              location.reload();
+            }
+          });
+      });
     }
   })
 

ambari-web/app/styles/alerts.less

@@ -73,6 +73,11 @@
   }
 }
 
+.alert-definition-review {
+  height: 400px;
+  overflow: scroll;
+}
+
 #alert-definitions-table {
   a {
     &.disabled {

ambari-web/app/templates/main/alerts/add_alert_definition/step3.hbs

@@ -18,7 +18,14 @@
 
 <h2>{{t alerts.add.step3.header}}</h2>
 
-{{controller.content.selectedType}}
+<div>
+  {{t alerts.add.step3.selectedType}}: <strong>{{controller.content.selectedType}}</strong>
+</div>
+<div class="control-group">
+  <div class="controls">
+    <pre class="alert-definition-review">{{view.alertDefinitionToDisplay}}</pre>
+  </div>
+</div>
 
 <div class="btn-area">
   <a class="btn" {{bindAttr disabled="isBackBtnDisabled"}} {{action back}}>&larr; {{t common.back}}</a>

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

@@ -383,6 +383,16 @@ var urls = {
       }
     }
   },
+  'alerts.create_alert_definition': {
+    'real': '/clusters/{clusterName}/alert_definitions/',
+    'mock': '',
+    'format': function (data) {
+      return {
+        type: 'POST',
+        data: JSON.stringify(data.data)
+      }
+    }
+  },
   'alerts.delete_alert_definition': {
     'real': '/clusters/{clusterName}/alert_definitions/{id}',
     'mock': '',

ambari-web/app/utils/ember_reopen.js

@@ -130,6 +130,36 @@ Ember.RadioButton = Ember.Checkbox.extend({
   }.property('value','selection')
 });
 
+/**
+ * Set value to obj by path
+ * Create nested objects if needed
+ * Example:
+ * <code>
+ *   var a = {b: {}};
+ *   var path = 'b.c.d';
+ *   var value = 1;
+ *   Em.setFullPath(a, path, value); // a = {b: {c: {d: 1}}
+ * </code>
+ *
+ * @param {object} obj
+ * @param {string} path
+ * @param {*} value
+ */
+Ember.setFullPath = function (obj, path, value) {
+  var parts = path.split('.'),
+    sub_path = '';
+  parts.forEach(function(_path, _index) {
+    Em.assert('path parts can\'t be empty', _path.length);
+    sub_path += '.' + _path;
+    if (_index === parts.length - 1) {
+      Em.set(obj, sub_path, value);
+      return;
+    }
+    if (Em.isNone(Em.get(obj, sub_path))) {
+      Em.set(obj, sub_path, {});
+    }
+  });
+};
 
 Em.View.reopen({
   /**

ambari-web/app/views/main/alerts/add_alert_definition/step3_view.js

@@ -20,6 +20,15 @@ var App = require('app');
 
 App.AddAlertDefinitionStep3View = Em.View.extend({
 
+  /**
+   * @type {string}
+   */
+  alertDefinitionToDisplay: '',
+
+  willInsertElement: function () {
+    this.set('alertDefinitionToDisplay', JSON.stringify(this.get('controller.content.formattedToRequestConfigs'),  null, 4));
+  },
+
   templateName: require('templates/main/alerts/add_alert_definition/step3')
 
 });

ambari-web/app/views/main/alerts/definition_configs_view.js

@@ -25,7 +25,7 @@ App.AlertDefinitionConfigsView = Em.View.extend({
   templateName: require('templates/main/alerts/configs'),
 
   /**
-   * Define whether configs are aditable
+   * Define whether configs are editable
    * is set in template
    * @type {Boolean}
    */

ambari-web/test/controllers/main/alerts/definitions_configs_controller_test.js

@@ -467,7 +467,7 @@ describe('App.MainAlertDefinitionConfigsController', function () {
       it(testCase.m, function () {
 
         controller.set('configs', testCase.configs);
-        var result = controller.getPropertiesToUpdate();
+        var result = controller.getPropertiesToUpdate(true);
 
         expect(result).to.eql(testCase.result);
       });