AMBARI-5964 Integrate server-side filtering of selected hosts. (atkach)

ambari-web/app/controllers/main/host.js

@@ -115,6 +115,11 @@ App.MainHostController = Em.ArrayController.extend(App.UserPref, {
       key: 'componentsInPassiveStateCount',
       alias: 'host_components/HostRoles/maintenance_state',
       type: 'PLAIN'
+    },
+    {
+      key: 'selected',
+      alias: 'Hosts/host_name',
+      type: 'MULTIPLE'
     }
   ],
 
@@ -211,10 +216,10 @@ App.MainHostController = Em.ArrayController.extend(App.UserPref, {
     savedFilterConditions.forEach(function (filter) {
       var property = filterProperties.findProperty('key', colPropAssoc[filter.iColumn]);
 
-      if (property && filter.value.length > 0) {
+      if (property && filter.value.length > 0 && !filter.skipFilter) {
         queryParams.push({
           key: property.alias,
-          value: (filter.type === 'multiple') ? filter.value.split(',') : filter.value,
+          value: filter.value,
           type: property.type
         });
       }

ambari-web/app/data/host/categories.js

@@ -75,19 +75,6 @@ module.exports = [
     type: 'number',
     filterValue: 'true'
   },
-  {
-    value: Em.I18n.t('common.selected'),
-    hostProperty: 'selected',
-    class: '',
-    isHealthStatus: false,
-    healthClass: 'health-status-SELECTED',
-    healthStatus: 'health-status-SELECTED',
-    selected: true,
-    column: 10,
-    type: 'boolean',
-    filterValue: true,
-    isVisible: false
-  },
   {
     value: Em.I18n.t('common.passive_state'),
     hostProperty: 'componentsInPassiveStateCount',

ambari-web/app/mappers/status_mapper.js

@@ -106,6 +106,11 @@ App.statusMapper = App.QuickDataMapper.create({
         }
       }, this);
 
+      //TODO remove when App.Host model dependencies will be replaced with server request
+      if (!App.router.get('clusterController.isLoaded')) {
+        App.hostsMapper.map(json);
+      }
+
       App.cache['previousComponentStatuses'] = currentComponentStatuses;
       App.cache['previousComponentPassiveStates'] = currentComponentPassiveStates;
       App.cache['hostComponentsOnService'] = hostComponentsOnService;

ambari-web/app/mixins/common/tableServerProvider.js

@@ -85,26 +85,32 @@ App.TableServerProvider = Em.Mixin.create({
    * @param type {String}
    */
   updateFilter: function (iColumn, value, type) {
+    this.saveFilterConditions(iColumn, value, type, false);
+    this.refresh();
+  },
+
+  /**
+   * save filter conditions to local storage
+   * @param iColumn {Number}
+   * @param value {String|Array}
+   * @param type {String}
+   * @param skipFilter {Boolean}
+   */
+  saveFilterConditions: function (iColumn, value, type, skipFilter) {
     var filterCondition = this.get('filterConditions').findProperty('iColumn', iColumn);
 
     if (filterCondition) {
       filterCondition.value = value;
+      filterCondition.skipFilter = skipFilter;
     } else {
       filterCondition = {
+        skipFilter: skipFilter,
         iColumn: iColumn,
         value: value,
         type: type
       };
       this.get('filterConditions').push(filterCondition);
     }
-    this.saveFilterConditions();
-    this.refresh();
-  },
-
-  /**
-   * save filter conditions to local storage
-   */
-  saveFilterConditions: function () {
     App.db.setFilterConditions(this.get('controller.name'), this.get('filterConditions'));
   }
 });

ambari-web/app/templates/main/host.hbs

@@ -147,13 +147,13 @@
       <label>{{view.filteredContentInfo}} - <a {{action clearFilters target="view"}} href="#">{{t tableView.filters.clearAllFilters}}</a></label>
     </div>
     <div class="selected-hosts-info span4">
-      {{#if view.selectedCategory.hostsCount}}
-        {{#view view.statusFilter categoriesBinding="view.categories"}}
-          <a {{action selectCategory view.parentView.selectedCategory target="view"}} href="#">
-            {{view.parentView.selectedCategory.hostsCount}}
-            {{pluralize view.parentView.selectedCategory.hostsCount singular="t:hosts.filters.selectedHostInfo" plural="t:hosts.filters.selectedHostsInfo"}}
+      {{#if view.showSelectedFilter}}
+        <div>
+          <a {{action filterSelected target="view"}} href="#">
+            {{view.selectedHosts.length}}
+            {{pluralize view.selectedHostsCount singular="t:hosts.filters.selectedHostInfo" plural="t:hosts.filters.selectedHostsInfo"}}
           </a>
-        {{/view}} - <a {{action clearSelection target="view"}} href="#">{{t hosts.filters.clearSelection}}</a>
+        </div> - <a {{action clearSelection target="view"}} href="#">{{t hosts.filters.clearSelection}}</a>
       {{/if}}
     </div>
     <div class="items-on-page">

ambari-web/app/views/main/host.js

@@ -36,14 +36,32 @@ App.MainHostView = App.TableView.extend(App.TableServerProvider, {
    * flag responsible for updating status counters of hosts
    */
   isCountersUpdating: false,
+  /**
+   * Contains all selected hosts on cluster
+   */
+  selectedHosts: [],
 
   /**
    * List of hosts in cluster
    * @type {Array}
    */
-  content:function () {
-    return this.get('controller.content');
-  }.property('controller.content.length'),
+  content: function () {
+    var selectedHosts = this.getSelectedFilter();
+    if (this.get('controller')) {
+      return this.get('controller.content').filter(function (host) {
+        host.set('selected', selectedHosts.contains(host.get('hostName')));
+        return true;
+      });
+    }
+    return [];
+  }.property('controller.content'),
+  /**
+   * flag to toggle displaying selected hosts counter
+   */
+  showSelectedFilter: function () {
+    return this.get('selectedHosts.length') > 0;
+  }.property('selectedHosts'),
+
   /**
    * return filtered number of all content number information displayed on the page footer bar
    * @returns {String}
@@ -156,8 +174,54 @@ App.MainHostView = App.TableView.extend(App.TableServerProvider, {
     else {
       this.set('selectAllHosts', false);
     }
+    this.combineSelectedFilter();
+    //10 is an index of selected column
+    this.saveFilterConditions(10, this.get('selectedHosts'), 'multiple', true);
+
     this.addObserver('selectAllHosts', this, this.toggleAllHosts);
   },
+  /**
+   * combine selected hosts on page with selected hosts which are filtered out but added to cluster
+   */
+  combineSelectedFilter: function () {
+    var previouslySelectedHosts = this.getSelectedFilter();
+    var selectedHosts = [];
+    var hostsOnPage = this.get('pageContent').mapProperty('hostName');
+    selectedHosts = this.get('pageContent').filterProperty('selected').mapProperty('hostName');
+
+    previouslySelectedHosts.forEach(function (hostName) {
+      if (!hostsOnPage.contains(hostName)) {
+        selectedHosts.push(hostName);
+      }
+    }, this);
+    this.set('selectedHosts', selectedHosts);
+  },
+
+  /**
+   * filter selected hosts
+   */
+  filterSelected: function() {
+    //10 is an index of selected column
+    this.updateFilter(10, this.get('selectedHosts'), 'multiple');
+  },
+
+  /**
+   * get selected filter previous value
+   * @return {Array}
+   */
+  getSelectedFilter: function() {
+    var filterCondition = this.get('filterConditions').findProperty('iColumn', 10);
+    var dbFilterConditions = App.db.getFilterConditions(this.get('controller.name'));
+    var selectedFilter = [];
+
+    if (filterCondition) {
+      selectedFilter = filterCondition.value;
+    }
+    else if (dbFilterConditions && dbFilterConditions.findProperty('iColumn', 10)) {
+        selectedFilter = dbFilterConditions.findProperty('iColumn', 10).value;
+    }
+    return selectedFilter;
+  },
 
   /**
    * Clear selectedFilter
@@ -166,7 +230,8 @@ App.MainHostView = App.TableView.extend(App.TableServerProvider, {
   clearSelection: function() {
     this.get('pageContent').setEach('selected', false);
     this.set('selectAllHosts', false);
-    this.clearFilters();
+    this.get('selectedHosts').clear();
+    this.filterSelected();
   },
 
   /**
@@ -339,17 +404,6 @@ App.MainHostView = App.TableView.extend(App.TableServerProvider, {
 
   }),
 
-  /**
-   * update hosts count of selected hosts category
-   */
-  updateSelectedCategory: function () {
-    var hostsCountMap = {
-      'health-status-SELECTED': this.get('content').filterProperty('selected').length
-    };
-
-    this.updateHostsCount(hostsCountMap);
-  }.observes('content.@each.selected'),
-
   /**
    * update status counters of hosts
    */
@@ -576,74 +630,6 @@ App.MainHostView = App.TableView.extend(App.TableServerProvider, {
     }
   }),
 
-  /**
-   * view of the alert filter implemented as a category of host statuses
-   */
-  alertFilter: Em.View.extend({
-    column: 7,
-    value: null,
-    classNames: ['noDisplay'],
-    showClearFilter: function(){
-      var mockEvent = {
-        context: this.get('parentView.categories').findProperty('healthStatus', 'health-status-WITH-ALERTS')
-      };
-      if(this.get('value')) {
-        this.get('parentView.childViews').findProperty('column', 0).selectCategory(mockEvent);
-      }
-    }
-  }),
-
-  /**
-   * view of the staleConfigs filter implemented as a category of host statuses
-   */
-  restartFilter: Em.View.extend({
-    column: 8,
-    value: null,
-    classNames: ['noDisplay'],
-    showClearFilter: function(){
-      var mockEvent = {
-        context: this.get('parentView.categories').findProperty('healthStatus', 'health-status-RESTART')
-      };
-      if(this.get('value')) {
-        this.get('parentView.childViews').findProperty('column', 0).selectCategory(mockEvent);
-      }
-    }
-  }),
-
-  /**
-   * view of the maintenance filter implemented as a category of host statuses
-   */
-  passiveStateFilter: Em.View.extend({
-    column: 9,
-    value: null,
-    classNames: ['noDisplay'],
-    showClearFilter: function(){
-      var mockEvent = {
-        context: this.get('parentView.categories').findProperty('healthStatus', 'health-status-PASSIVE_STATE')
-      };
-      if(this.get('value')) {
-        this.get('parentView.childViews').findProperty('column', 0).selectCategory(mockEvent);
-      }
-    }
-  }),
-
-  /**
-   * view of the "selected" filter implemented as a category of host statuses
-   */
-  selectedFilter: Em.View.extend({
-    column: 10,
-    value: null,
-    class: ['noDisplay'],
-    showClearFilter: function(){
-      var mockEvent = {
-        context: this.get('parentView.categories').findProperty('healthStatus', 'health-status-SELECTED')
-      };
-      if(this.get('value')) {
-        this.get('parentView.childViews').findProperty('column', 0).selectCategory(mockEvent);
-      }
-    }
-  }),
-
   /**
    * Filter view for name column
    * Based on <code>filters</code> library
@@ -787,7 +773,7 @@ App.MainHostView = App.TableView.extend(App.TableServerProvider, {
           chosenComponents.push(item.get('id'));
         });
         Em.run.next(function() {
-          self.set('value', chosenComponents.toString());
+          self.set('value', chosenComponents);
         });
       },