AMBARI-5161 Customize Services step load: change calls to asynchronous. (atkach)

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

@@ -342,7 +342,10 @@ App.MainServiceInfoConfigsController = Em.Controller.extend({
     //STEP 2: Create an array of objects defining tag names to be polled and new tag names to be set after submit
     this.setServiceConfigTags(this.loadedClusterSiteToTagMap);
     //STEP 3: Load advanced configs from server
-    var advancedConfigs = App.config.loadAdvancedConfig(serviceName) || [];
+    var advancedConfigs = [];
+    App.config.loadAdvancedConfig(serviceName, function (properties) {
+      advancedConfigs.pushObjects(properties);
+    }, true);
     //STEP 4: Load on-site config by service from server
     var configGroups = App.router.get('configurationController').getConfigsByTags(this.get('serviceConfigTags'));
     //STEP 5: Merge global and on-site configs with pre-defined

ambari-web/app/controllers/wizard.js

@@ -691,16 +691,23 @@ App.WizardController = Em.Controller.extend({
   /**
    * load advanced configs from server
    */
-  loadAdvancedConfigs: function () {
-    var configs = (this.getDBProperty('advancedServiceConfig')) ? this.getDBProperty('advancedServiceConfig') : [];
-    this.get('content.services').filterProperty('isSelected', true).mapProperty('serviceName').forEach(function (_serviceName) {
-      var serviceComponents = App.config.loadAdvancedConfig(_serviceName);
-      if (serviceComponents) {
-        configs = configs.concat(serviceComponents);
-      }
+  loadAdvancedConfigs: function (dependentController) {
+    var self = this;
+    var counter = this.get('content.services').filterProperty('isSelected').length;
+    var loadAdvancedConfigResult = [];
+    dependentController.set('isAdvancedConfigLoaded', false);
+    this.get('content.services').filterProperty('isSelected').mapProperty('serviceName').forEach(function (_serviceName) {
+      App.config.loadAdvancedConfig(_serviceName, function (properties) {
+        loadAdvancedConfigResult.pushObjects(properties);
+        counter--;
+        //pass configs to controller after last call is completed
+        if (counter === 0) {
+          self.set('content.advancedServiceConfig', loadAdvancedConfigResult);
+          self.setDBProperty('advancedServiceConfig', loadAdvancedConfigResult);
+          dependentController.set('isAdvancedConfigLoaded', true);
+        }
+      });
     }, this);
-    this.set('content.advancedServiceConfig', configs);
-    this.setDBProperty('advancedServiceConfig', configs);
   },
   /**
    * Load serviceConfigProperties to model

ambari-web/app/controllers/wizard/step7_controller.js

@@ -62,6 +62,8 @@ App.WizardStep7Controller = Em.Controller.extend({
 
   serviceConfigsData: require('data/service_configs'),
 
+  isAdvancedConfigLoaded: true,
+
   isSubmitDisabled: function () {
     return (!this.stepConfigs.filterProperty('showConfig', true).everyProperty('errorCount', 0) || this.get("miscModalVisible"));
   }.property('stepConfigs.@each.errorCount', 'miscModalVisible'),
@@ -342,6 +344,9 @@ App.WizardStep7Controller = Em.Controller.extend({
    */
   loadStep: function () {
     console.log("TRACE: Loading step7: Configure Services");
+    if (!this.get('isAdvancedConfigLoaded')) {
+      return;
+    }
     this.clearStep();
     //STEP 1: Load advanced configs
     var advancedConfigs = this.get('content.advancedServiceConfig');

ambari-web/app/routes/add_service_routes.js

@@ -185,9 +185,9 @@ module.exports = App.WizardRoute.extend({
       var controller = router.get('addServiceController');
       controller.setCurrentStep('4');
       controller.dataLoading().done(function () {
-        controller.loadAllPriorSteps();
-        controller.loadAdvancedConfigs();
         var wizardStep7Controller = router.get('wizardStep7Controller');
+        controller.loadAllPriorSteps();
+        controller.loadAdvancedConfigs(wizardStep7Controller);
         wizardStep7Controller.set('wizardController', controller);
         controller.connectOutlet('wizardStep7', controller.get('content'));
       })

ambari-web/app/routes/installer.js

@@ -285,6 +285,7 @@ module.exports = Em.Route.extend({
     next: function (router) {
       var controller = router.get('installerController');
       var wizardStep6Controller = router.get('wizardStep6Controller');
+      var wizardStep7Controller = router.get('wizardStep7Controller');
 
       if (wizardStep6Controller.validate()) {
         controller.saveSlaveComponentHosts(wizardStep6Controller);
@@ -292,7 +293,7 @@ module.exports = Em.Route.extend({
         controller.setDBProperty('serviceConfigProperties', null);
         controller.setDBProperty('advancedServiceConfig', null);
         controller.setDBProperty('serviceConfigGroups', null);
-        controller.loadAdvancedConfigs();
+        controller.loadAdvancedConfigs(wizardStep7Controller);
         router.transitionTo('step7');
       }
     }

ambari-web/app/templates/wizard/step7.hbs

@@ -23,7 +23,12 @@
       {{t installer.step7.body}}
     </div>
 
-    {{view App.ServicesConfigView}}
+    {{#if isAdvancedConfigLoaded}}
+      {{view App.ServicesConfigView}}
+    {{else}}
+      <div class="spinner"></div>
+    {{/if}}
+
 
     <div class="btn-area">
         <a class="btn" {{action back}}>&larr; {{t common.back}}</a>
@@ -32,4 +37,4 @@
                 class="btn btn-success pull-right" {{bindAttr disabled="isSubmitDisabled"}}
           {{action submit target="controller"}}>{{t common.next}} &rarr;</a>
     </div>
-</div>
+</div>

ambari-web/app/utils/ajax.js

@@ -300,9 +300,9 @@ var urls = {
   'config.advanced': {
     'real': '{stack2VersionUrl}/stackServices/{serviceName}/configurations?fields=*',
     'mock': '/data/wizard/stack/hdp/version{stackVersion}/{serviceName}.json',
-    'format': function() {
+    'format': function (data) {
       return {
-        async: false
+        async: !data.sync
       };
     }
   },

ambari-web/app/utils/config.js

@@ -20,7 +20,6 @@ var App = require('app');
 var stringUtils = require('utils/string_utils');
 
 var categotyConfigs = require('data/service_configs');
-var serviceComponents = {};
 var configGroupsByTag = [];
 
 App.config = Em.Object.create({
@@ -515,7 +514,7 @@ App.config = Em.Object.create({
    * @param serviceName
    */
   addAdvancedConfigs: function (serviceConfigs, advancedConfigs, serviceName) {
-    var configsToVerifying = (serviceName) ? serviceConfigs.filterProperty('serviceName', serviceName) : serviceConfigs;
+    var configsToVerifying = (serviceName) ? serviceConfigs.filterProperty('serviceName', serviceName) : serviceConfigs.slice();
     advancedConfigs.forEach(function (_config) {
       var configCategory = 'Advanced';
       var categoryMetaData = null;
@@ -751,19 +750,20 @@ App.config = Em.Object.create({
    * @param serviceName
    * @return {*}
    */
-  loadAdvancedConfig: function (serviceName) {
+  loadAdvancedConfig: function (serviceName, callback, sync) {
     App.ajax.send({
       name: 'config.advanced',
       sender: this,
       data: {
         serviceName: serviceName,
         stack2VersionUrl: App.get('stack2VersionURL'),
-        stackVersion: App.get('currentStackVersionNumber')
+        stackVersion: App.get('currentStackVersionNumber'),
+        callback: callback,
+        sync: sync
       },
-      success: 'loadAdvancedConfigSuccess'
+      success: 'loadAdvancedConfigSuccess',
+      error: 'loadAdvancedConfigError'
     });
-    return serviceComponents[serviceName];
-    //TODO clean serviceComponents
   },
 
   loadAdvancedConfigSuccess: function (data, opt, params) {
@@ -793,8 +793,13 @@ App.config = Em.Object.create({
           });
         }
       }, this);
-      serviceComponents[data.items[0].StackConfigurations.service_name] = properties;
     }
+    params.callback(properties);
+  },
+
+  loadAdvancedConfigError: function (request, ajaxOptions, error, opt, params) {
+    console.log('ERROR: failed to load stack configs for', params.serviceName);
+    params.callback([]);
   },
 
   /**