AMBARI-5999 Convert Heatmaps page to load all hosts on demand. (atkach)

ambari-web/app/controllers/global/cluster_controller.js

@@ -356,6 +356,7 @@ App.ClusterController = Em.Controller.extend({
             updater.updateComponentsState(function () {
               self.updateLoadStatus('componentsState');
             });
+            self.updateLoadStatus('serviceMetrics');
           });
 
           if (App.supports.hostOverrides) {
@@ -369,30 +370,6 @@ App.ClusterController = Em.Controller.extend({
       });
     });
   },
-  /**
-   * json from serviceMetricsMapper on initial load
-   */
-  serviceMetricsJson: null,
-  /**
-   * control that services was loaded to model strictly after hosts and host-components
-   * regardless which request was completed first
-   * @param json
-   */
-  deferServiceMetricsLoad: function (json) {
-    if (json) {
-      if (this.get('dataLoadList.hosts')) {
-        App.serviceMetricsMapper.map(json, true);
-        this.updateLoadStatus('serviceMetrics');
-      } else {
-        this.set('serviceMetricsJson', json);
-      }
-    } else if (this.get('serviceMetricsJson')) {
-      json = this.get('serviceMetricsJson');
-      this.set('serviceMetricsJson', null);
-      App.serviceMetricsMapper.map(json, true);
-      this.updateLoadStatus('serviceMetrics');
-    }
-  },
 
   requestHosts: function (realUrl, callback) {
     var testHostUrl = App.get('isHadoop2Stack') ? '/data/hosts/HDP2/hosts.json' : '/data/hosts/hosts.json';

ambari-web/app/controllers/global/update_controller.js

@@ -154,7 +154,7 @@ App.UpdateController = Em.Controller.extend({
     var testUrl = App.get('isHadoop2Stack') ? '/data/hosts/HDP2/hosts.json' : '/data/hosts/hosts.json';
     var realUrl = '/hosts?<parameters>fields=Hosts/host_name,Hosts/maintenance_state,Hosts/public_host_name,Hosts/cpu_count,Hosts/ph_cpu_count,Hosts/total_mem,' +
       'Hosts/host_status,Hosts/last_heartbeat_time,Hosts/os_arch,Hosts/os_type,Hosts/ip,host_components/HostRoles/state,host_components/HostRoles/maintenance_state,' +
-      'Hosts/disk_info,metrics/disk,metrics/load/load_one,metrics/cpu/cpu_system,metrics/cpu/cpu_user,' +
+      'metrics/disk,metrics/load/load_one,metrics/cpu/cpu_system,metrics/cpu/cpu_user,' +
       'metrics/memory/mem_total,metrics/memory/mem_free,alerts/summary&minimal_response=true';
 
     this.get('queryParams').set('Hosts', App.router.get('mainHostController').getQueryParameters());

ambari-web/app/controllers/main/charts/heatmap_metrics/heatmap_metric.js

@@ -239,14 +239,13 @@ App.MainChartHeatmapMetric = Em.Object.extend(heatmap.mappers, {
   hostToSlotMap: function(){
     var hostToValueMap = this.get('hostToValueMap');
     var slotDefs = this.get('slotDefinitions');
-    var allHosts = App.Host.find();
+    var hostNames = App.Host.find().mapProperty('hostName');
     var hostToSlotMap = {};
-    if (hostToValueMap && allHosts) {
-      allHosts.forEach(function(host){
+    if (hostToValueMap && hostNames) {
+      hostNames.forEach(function(hostName){
         var slot = -1;
-        var key = host.get('hostName');
-        if (key in hostToValueMap) {
-          var value = hostToValueMap[key];
+        if (hostName in hostToValueMap) {
+          var value = hostToValueMap[hostName];
           if (isNaN(value)) {
             slot = slotDefs.length - 2;
           } else {
@@ -265,7 +264,7 @@ App.MainChartHeatmapMetric = Em.Object.extend(heatmap.mappers, {
           slot = slotDefs.length - 1;
         }
         if (slot > -1) {
-          hostToSlotMap[key] = slot;
+          hostToSlotMap[hostName] = slot;
         }
       });
     }

ambari-web/app/mappers/hosts_mapper.js

@@ -54,7 +54,7 @@ App.hostsMapper = App.QuickDataMapper.create({
     ip: 'Hosts.ip',
     passive_state: 'Hosts.maintenance_state'
   },
-  map: function (json) {
+  map: function (json, isAll) {
     console.time('App.hostsMapper execution time');
     if (json.items) {
       var hostsWithFullInfo = [];
@@ -65,14 +65,15 @@ App.hostsMapper = App.QuickDataMapper.create({
         item.host_components.forEach(function (host_component) {
           host_component.id = host_component.HostRoles.component_name + "_" + item.Hosts.host_name;
         }, this);
-        item.Hosts.disk_info = item.Hosts.disk_info.filter(function(h) {return h.mountpoint!="/boot"});
         item.critical_alerts_count = (item.alerts) ? item.alerts.summary.CRITICAL + item.alerts.summary.WARNING : 0;
         item.cluster_id = App.get('clusterName');
 
-        hostIds[item.Hosts.host_name] = true;
+
 
         var parsedItem = this.parseIt(item, this.config);
-        parsedItem.is_requested = true;
+        parsedItem.is_requested = !isAll;
+
+        hostIds[item.Hosts.host_name] = parsedItem;
 
         hostsWithFullInfo.push(parsedItem);
       }, this);
@@ -80,7 +81,9 @@ App.hostsMapper = App.QuickDataMapper.create({
       hostsWithFullInfo = hostsWithFullInfo.sortProperty('public_host_name');
 
       App.Host.find().forEach(function (host) {
-        if (!hostIds[host.get('hostName')]) {
+        if (isAll && host.get('isRequested')) {
+          hostIds[host.get('hostName')].is_requested = true;
+        } else if (!hostIds[host.get('hostName')]) {
           host.set('isRequested', false);
         }
       });

ambari-web/app/mappers/service_metrics_mapper.js

@@ -171,11 +171,7 @@ App.serviceMetricsMapper = App.QuickDataMapper.create({
     $service_id: 'none' /* will be set outside of parse function */
   },
 
-  map: function (json, isDefered) {
-    if (!isDefered && !App.router.get('clusterController.isLoaded')) {
-      App.router.get('clusterController').deferServiceMetricsLoad(json);
-      return;
-    }
+  map: function (json) {
     console.time('App.serviceMetricsMapper execution time');
     if (json.items) {
 

ambari-web/app/models/rack.js

@@ -24,18 +24,10 @@ App.Rack = DS.Model.extend({
   status: DS.attr('string'),
   criticalHostsCount: DS.attr('number'),
   deadHostsCount: DS.attr('number'),
-  hosts: function(){
-    return App.Host.find();
-  }.property('name'),
-  liveHostsCount: function(){
-    var count = 0;
-    this.get('hosts').forEach(function(host){
-      if(host.get('healthStatus')=="HEALTHY"){
-        count++;
-      }
-    });
-    return count;
-  }.property('hosts')
+  hosts: App.Host.find(),
+  liveHostsCount: function () {
+    return this.get('hosts').filterProperty('healthStatus', 'HEALTHY').length;
+  }.property('hosts.@each.healthStatus')
 });
 
 App.Rack.FIXTURES = [

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

@@ -2146,6 +2146,10 @@ var urls = {
   'host_components.with_services_names': {
     'real': '/clusters/{clusterName}/host_components?fields=component/ServiceComponentInfo/service_name,HostRoles/host_name&minimal_response=true',
     'mock': ''
+  },
+  'hosts.heatmaps': {
+    'real': '/clusters/{clusterName}/hosts?fields=Hosts/host_name,Hosts/maintenance_state,Hosts/public_host_name,Hosts/cpu_count,Hosts/ph_cpu_count,Hosts/total_mem,Hosts/host_status,Hosts/last_heartbeat_time,Hosts/os_arch,Hosts/os_type,Hosts/ip,host_components/HostRoles/state,host_components/HostRoles/maintenance_state,Hosts/disk_info,metrics/disk,metrics/load/load_one,metrics/cpu/cpu_system,metrics/cpu/cpu_user,metrics/memory/mem_total,metrics/memory/mem_free,alerts/summary&minimal_response=true',
+    'mock': ''
   }
 };
 /**

ambari-web/app/views/main/charts/heatmap/heatmap_rack.js

@@ -27,27 +27,38 @@ App.MainChartsHeatmapRackView = Em.View.extend({
   /** rack status block class */
   statusIndicator:'statusIndicator',
   /** loaded hosts of rack */
-  hosts: [],
+  hosts: function() {
+    return this.get('rack.hosts').toArray();
+  }.property('rack.hosts'),
 
   willInsertElement: function () {
-    this.set('hosts', []);
+    this.set('rack.isLoaded', false);
+  },
+
+  /**
+   * get hosts from server
+   */
+  getHosts: function () {
+    App.ajax.send({
+      name: 'hosts.heatmaps',
+      sender: this,
+      data: {},
+      success: 'getHostsSuccessCallback',
+      error: 'getHostsErrorCallback'
+    });
+  },
+
+  getHostsSuccessCallback: function (data, opt, params) {
+    App.hostsMapper.map(data, true);
+    this.set('rack.isLoaded', true);
+  },
+
+  getHostsErrorCallback: function(request, ajaxOptions, error, opt, params){
+    this.set('rack.isLoaded', true);
   },
 
   didInsertElement: function () {
-    var rackHosts = this.get('rack.hosts').toArray();
-    if (rackHosts.length > 100) {
-      lazyloading.run({
-        destination: this.get('hosts'),
-        source: rackHosts,
-        context: this.get('rack'),
-        initSize: 25,
-        chunkSize: 100,
-        delay: 25
-      });
-    } else {
-      this.set('hosts', rackHosts);
-      this.set('rack.isLoaded', true);
-    }
+    this.getHosts();
   },
   /**
    * Provides the CSS style for an individual host.
@@ -57,11 +68,13 @@ App.MainChartsHeatmapRackView = Em.View.extend({
     var rack = this.get('rack');
     var widthPercent = 100;
     var hostCount = rack.get('hosts.length');
-    if (hostCount && hostCount < 11) {
-      widthPercent = (100 / hostCount) - 0.5;
-    } else {
-      widthPercent = 10; // max out at 10%
+    if (rack.get('isLoaded')) {
+      if (hostCount && hostCount < 11) {
+        widthPercent = (100 / hostCount) - 0.5;
+      } else {
+        widthPercent = 10; // max out at 10%
+      }
     }
     return "width:" + widthPercent + "%;float:left;";
-  }.property('rack')
+  }.property('rack.isLoaded')
 });