You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ambari.apache.org by at...@apache.org on 2014/11/10 18:28:48 UTC

ambari git commit: AMBARI-8256 Select filter should handle options with different value and label. (atkach)

Repository: ambari
Updated Branches:
  refs/heads/trunk caf03d022 -> 8d7b99343


AMBARI-8256 Select filter should handle options with different value and label. (atkach)


Project: http://git-wip-us.apache.org/repos/asf/ambari/repo
Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/8d7b9934
Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/8d7b9934
Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/8d7b9934

Branch: refs/heads/trunk
Commit: 8d7b99343abc0711c9c50b635b7621a374eec7e1
Parents: caf03d0
Author: Andrii Tkach <at...@hortonworks.com>
Authored: Mon Nov 10 19:28:40 2014 +0200
Committer: Andrii Tkach <at...@hortonworks.com>
Committed: Mon Nov 10 19:28:40 2014 +0200

----------------------------------------------------------------------
 ambari-web/app/views/common/filter_view.js      | 117 +++++++++----------
 ambari-web/app/views/common/table_view.js       |   2 +-
 .../admin/stack_versions/stack_version_view.js  |  24 ++--
 .../app/views/main/alert_definitions_view.js    |  89 ++++++++++++--
 ambari-web/app/views/main/apps_view.js          |  52 ++++++++-
 .../views/main/dashboard/config_history_view.js |  68 +++++++++--
 .../app/views/main/host/stack_versions_view.js  |  64 +++++++---
 .../app/views/main/mirroring/datasets_view.js   |  28 +++--
 .../app/views/main/mirroring/jobs_view.js       |  96 +++++++++++++--
 9 files changed, 411 insertions(+), 129 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/ambari/blob/8d7b9934/ambari-web/app/views/common/filter_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/common/filter_view.js b/ambari-web/app/views/common/filter_view.js
index 6e28209..7b45873 100644
--- a/ambari-web/app/views/common/filter_view.js
+++ b/ambari-web/app/views/common/filter_view.js
@@ -34,7 +34,7 @@ var wrapperView = Ember.View.extend({
   template: Ember.Handlebars.compile(
     '{{#if view.fieldId}}<input type="hidden" id="{{unbound view.fieldId}}" value="" />{{/if}}' +
     '{{view view.filterView}}' +
-    '{{#if view.showApply}}<button {{action "setValueOnApply" target="view"}} class="apply-btn btn"><span>Apply</span></button>{{/if}} '
+    '{{#if view.showApply}}<button {{action "setValueOnApply" target="view"}} class="apply-btn btn"><span>{{t common.apply}}</span></button>{{/if}} '
   ),
 
   value: null,
@@ -68,9 +68,9 @@ var wrapperView = Ember.View.extend({
    **/
   triggeredOnSameValue: null,
 
-  clearFilter: function(){
+  clearFilter: function () {
     this.set('value', this.get('emptyValue'));
-    if(this.get('setPropertyOnApply')){
+    if (this.get('setPropertyOnApply')) {
       this.setValueOnApply();
     }
     return false;
@@ -96,17 +96,10 @@ var wrapperView = Ember.View.extend({
   appliedEmptyValue: "",
 
   /**
-   * reset value to empty string if emptyValue selected
-   */
-  actualValue: function () {
-    return this.get('value') === this.get('emptyValue') ? "" : this.get('value');
-  }.property('value'),
-
-  /**
    * Whether our <code>value</code> is empty or not
    * @return {Boolean}
    */
-  isEmpty: function(){
+  isEmpty: function () {
     if (Em.isNone(this.get('value'))) {
       return true;
     }
@@ -118,13 +111,13 @@ var wrapperView = Ember.View.extend({
    * Also this method updates computed field related to <code>fieldId</code> if it exists.
    * Call <code>onChangeValue</code> callback when everything is done.
    */
-  showClearFilter: function(){
-    if(!this.get('parentNode')){
+  showClearFilter: function () {
+    if (!this.get('parentNode')) {
       return;
     }
     // get the sort view element in the same column to current filter view to highlight them together
     var relatedSort = $(this.get('element')).parents('thead').find('.sort-view-' + this.get('column'));
-    if(this.isEmpty()){
+    if (this.isEmpty()) {
       this.get('parentNode').removeClass('active-filter');
       this.get('parentNode').addClass('notActive');
       relatedSort.removeClass('active-sort');
@@ -134,7 +127,7 @@ var wrapperView = Ember.View.extend({
       relatedSort.addClass('active-sort');
     }
 
-    if(this.get('fieldId')){
+    if (this.get('fieldId')) {
       this.$('> input').eq(0).val(this.get('value'));
     }
 
@@ -144,7 +137,7 @@ var wrapperView = Ember.View.extend({
   /**
    * Callback for value changes
    */
-  onChangeValue: function(){
+  onChangeValue: function () {
 
   },
 
@@ -156,7 +149,7 @@ var wrapperView = Ember.View.extend({
   /**
    * Update class of parentNode(hide clear filter button) on page load
    */
-  didInsertElement: function(){
+  didInsertElement: function () {
     var parent = this.$().parent();
     this.set('parentNode', parent);
     parent.addClass('notActive');
@@ -166,19 +159,19 @@ var wrapperView = Ember.View.extend({
   /**
    * Check for Em.Select that should use dispatching event when option with same value selected more than one time.
    **/
-  checkSelectSpecialOptions: function() {
+  checkSelectSpecialOptions: function () {
     // check predefined property
     if (!this.get('triggeredOnSameValue') || !this.get('triggeredOnSameValue').length) return;
     // add custom additional observer that will handle property changes
     this.addObserver('value', this, 'valueCustomObserver');
     // get the full class attribute to find our select
     var classInlineAttr = this.get('fieldType').split(',')
-      .map(function(className) {
+      .map(function (className) {
         return '.' + className.trim();
       }).join('');
     this.set('classInlineAttr', classInlineAttr);
-    this.get('triggeredOnSameValue').forEach(function(triggeredValue) {
-      triggeredValue.values.forEach(function(value, index) {
+    this.get('triggeredOnSameValue').forEach(function (triggeredValue) {
+      triggeredValue.values.forEach(function (value, index) {
         // option with property `value`
         var $optionEl = $(this.get('element')).find(classInlineAttr)
           .find('option[value="' + value + '"]');
@@ -198,9 +191,9 @@ var wrapperView = Ember.View.extend({
    * when option with same value selected more than one time.
    *
    **/
-  valueCustomObserver: function() {
+  valueCustomObserver: function () {
     var hiddenValue;
-    this.get('triggeredOnSameValue').forEach(function(triggeredValue) {
+    this.get('triggeredOnSameValue').forEach(function (triggeredValue) {
       var values = triggeredValue.values;
       // find current selected value from `values` list
       var currentValueIndex = values.indexOf(this.get('value'));
@@ -223,7 +216,7 @@ var wrapperView = Ember.View.extend({
  * Simple input control for wrapperView
  */
 var textFieldView = Ember.TextField.extend({
-  type:'text',
+  type: 'text',
   placeholder: Em.I18n.t('any'),
   valueBinding: "parentView.value"
 });
@@ -250,14 +243,14 @@ var componentFieldView = Ember.View.extend({
   /**
    * Clear filter to initial state
    */
-  clearFilter: function(){
+  clearFilter: function () {
     this.set('value', '');
   },
 
   /**
    * Onclick handler for <code>cancel filter</code> button
    */
-  closeFilter:function () {
+  closeFilter: function () {
     $(document).unbind('click');
     this.set('isFilterOpen', false);
   },
@@ -265,7 +258,7 @@ var componentFieldView = Ember.View.extend({
   /**
    * Onclick handler for <code>apply filter</code> button
    */
-  applyFilter:function() {
+  applyFilter: function () {
     this.closeFilter();
   },
 
@@ -273,7 +266,7 @@ var componentFieldView = Ember.View.extend({
    * Onclick handler for <code>show component filter</code> button.
    * Also this function is used in some other places
    */
-  clickFilterButton:function () {
+  clickFilterButton: function () {
     var self = this;
     this.set('isFilterOpen', !this.get('isFilterOpen'));
     if (this.get('isFilterOpen')) {
@@ -295,8 +288,10 @@ var componentFieldView = Ember.View.extend({
  * Simple select control for wrapperView
  */
 var selectFieldView = Ember.Select.extend({
-  selectionBinding: 'parentView.value',
-  contentBinding: 'parentView.content'
+  selectionBinding: 'parentView.selected',
+  contentBinding: 'parentView.content',
+  optionValuePath: "content.value",
+  optionLabelPath: "content.label"
 });
 
 /**
@@ -307,12 +302,12 @@ module.exports = {
   /**
    * You can access wrapperView outside
    */
-  wrapperView : wrapperView,
+  wrapperView: wrapperView,
 
   /**
    * And also controls views if need it
    */
-  textFieldView : textFieldView,
+  textFieldView: textFieldView,
   selectFieldView: selectFieldView,
   componentFieldView: componentFieldView,
 
@@ -320,10 +315,10 @@ module.exports = {
    * Quick create input filters
    * @param config parameters of <code>wrapperView</code>
    */
-  createTextView : function(config){
+  createTextView: function (config) {
     config.fieldType = config.fieldType || 'input-medium';
     config.filterView = textFieldView.extend({
-      classNames : [ config.fieldType ]
+      classNames: [ config.fieldType ]
     });
 
     return wrapperView.extend(config);
@@ -333,10 +328,10 @@ module.exports = {
    * Quick create multiSelect filters
    * @param config parameters of <code>wrapperView</code>
    */
-  createComponentView : function(config){
-    config.clearFilter = function(){
-      this.forEachChildView(function(item){
-        if(item.clearFilter){
+  createComponentView: function (config) {
+    config.clearFilter = function () {
+      this.forEachChildView(function (item) {
+        if (item.clearFilter) {
           item.clearFilter();
         }
       });
@@ -350,16 +345,18 @@ module.exports = {
    * Quick create select filters
    * @param config parameters of <code>wrapperView</code>
    */
-  createSelectView: function(config){
-
+  createSelectView: function (config) {
     config.fieldType = config.fieldType || 'input-medium';
     config.filterView = selectFieldView.extend({
-      classNames : config.fieldType.split(','),
-      attributeBindings: ['disabled','multiple'],
+      classNames: config.fieldType.split(','),
+      attributeBindings: ['disabled', 'multiple'],
       disabled: false
     });
-    config.emptyValue = config.emptyValue || 'Any';
 
+    config.valueBinding = 'selected.value';
+    config.clearFilter = function () {
+      this.set('selected', this.get('content').findProperty('value', this.get('emptyValue')));
+    };
     return wrapperView.extend(config);
   },
   /**
@@ -368,10 +365,10 @@ module.exports = {
    * @param isGlobal check is search global
    * @return {Function}
    */
-  getFilterByType: function(type, isGlobal){
-    switch (type){
+  getFilterByType: function (type, isGlobal) {
+    switch (type) {
       case 'ambari-bandwidth':
-        return function(rowValue, rangeExp){
+        return function (rowValue, rangeExp) {
           var compareChar = isNaN(rangeExp.charAt(0)) ? rangeExp.charAt(0) : false;
           var compareScale = rangeExp.charAt(rangeExp.length - 1);
           var compareValue = compareChar ? parseFloat(rangeExp.substr(1, rangeExp.length)) : parseFloat(rangeExp.substr(0, rangeExp.length));
@@ -404,13 +401,13 @@ module.exports = {
             var rowValueScale = rowValue.substr(rowValue.length - 2, 2);
             switch (rowValueScale) {
               case 'KB':
-                convertedRowValue = parseFloat(rowValue)*1024;
+                convertedRowValue = parseFloat(rowValue) * 1024;
                 break;
               case 'MB':
-                convertedRowValue = parseFloat(rowValue)*1048576;
+                convertedRowValue = parseFloat(rowValue) * 1048576;
                 break;
               case 'GB':
-                convertedRowValue = parseFloat(rowValue)*1073741824;
+                convertedRowValue = parseFloat(rowValue) * 1073741824;
                 break;
             }
           }
@@ -502,7 +499,7 @@ module.exports = {
         };
         break;
       case 'number':
-        return function(rowValue, rangeExp){
+        return function (rowValue, rangeExp) {
           var compareChar = rangeExp.charAt(0);
           var compareValue;
           var match = false;
@@ -543,16 +540,16 @@ module.exports = {
         };
         break;
       case 'multiple':
-        return function(origin, compareValue){
+        return function (origin, compareValue) {
           var options = compareValue.split(',');
-          if(typeof (origin) === "string"){
+          if (typeof (origin) === "string") {
             var rowValue = origin;
-          }else{
+          } else {
             var rowValue = origin.mapProperty('componentName').join(" ");
           }
           var str = new RegExp(compareValue, "i");
           for (var i = 0; i < options.length; i++) {
-            if(!isGlobal) {
+            if (!isGlobal) {
               str = new RegExp('(\\W|^)' + options[i] + '(\\W|$)');
             }
             if (rowValue.search(str) !== -1) {
@@ -563,20 +560,20 @@ module.exports = {
         };
         break;
       case 'boolean':
-        return function (origin, compareValue){
+        return function (origin, compareValue) {
           return origin === compareValue;
         };
         break;
       case 'select':
-        return function (origin, compareValue){
+        return function (origin, compareValue) {
           return origin == compareValue;
         };
         break;
       case 'range':
-        return function (origin, compareValue){
+        return function (origin, compareValue) {
           if (compareValue[1] && compareValue[0]) {
             return origin >= compareValue[0] && origin <= compareValue[1];
-          } else if (compareValue[0]){
+          } else if (compareValue[0]) {
             return origin >= compareValue[0];
           } else if (compareValue[1]) {
             return origin <= compareValue[1]
@@ -586,8 +583,8 @@ module.exports = {
         break;
       case 'string':
       default:
-        return function(origin, compareValue){
-          var regex = new RegExp(compareValue,"i");
+        return function (origin, compareValue) {
+          var regex = new RegExp(compareValue, "i");
           return regex.test(origin);
         }
     }

http://git-wip-us.apache.org/repos/asf/ambari/blob/8d7b9934/ambari-web/app/views/common/table_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/common/table_view.js b/ambari-web/app/views/common/table_view.js
index bbf346a..232cfb6 100644
--- a/ambari-web/app/views/common/table_view.js
+++ b/ambari-web/app/views/common/table_view.js
@@ -105,7 +105,7 @@ App.TableView = Em.View.extend(App.UserPref, {
         var view = !Em.isNone(condition.iColumn) && childViews.findProperty('column', condition.iColumn);
         if (view) {
           if (view.get('emptyValue')) {
-            view.set('value', view.get('emptyValue'));
+            view.clearFilter();
             self.saveFilterConditions(condition.iColumn, view.get('appliedEmptyValue'), condition.type, false);
           } else {
             view.set('value', condition.value);

http://git-wip-us.apache.org/repos/asf/ambari/blob/8d7b9934/ambari-web/app/views/main/admin/stack_versions/stack_version_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/main/admin/stack_versions/stack_version_view.js b/ambari-web/app/views/main/admin/stack_versions/stack_version_view.js
index 3ce30c2..b0793b0 100644
--- a/ambari-web/app/views/main/admin/stack_versions/stack_version_view.js
+++ b/ambari-web/app/views/main/admin/stack_versions/stack_version_view.js
@@ -85,12 +85,21 @@ App.MainStackVersionsView = App.TableView.extend({
     column: 1,
     fieldType: 'filter-input-width',
     content: function () {
-      return ['All'].concat(App.StackVersion.find().mapProperty('name'));
+      return [
+        {
+          value: '',
+          label: Em.I18n.t('common.all')
+        }
+      ].concat(App.StackVersion.find().map(function (service) {
+        return {
+          value: service.get('name'),
+          label: service.get('name')
+        }
+      }));
     }.property('App.router.mainStackVersionsController.dataIsLoaded'),
     onChangeValue: function () {
-      this.get('parentView').updateFilter(this.get('column'), this.get('actualValue'), 'select');
-    },
-    emptyValue: Em.I18n.t('common.all')
+      this.get('parentView').updateFilter(this.get('column'), this.get('value'), 'select');
+    }
   }),
 
   stackVersionFilterView: filters.createTextView({
@@ -142,11 +151,8 @@ App.MainStackVersionsView = App.TableView.extend({
     }.property('content.operatingSystems.length')
   }),
 
-
-  didInsertElement: function() {
-    this.get('controller').load().done(function(){
-      this.set('filteredContent',this.get('content'));
-    }, this);
+  didInsertElement: function () {
+    this.get('controller').load();
   }
 
 });

http://git-wip-us.apache.org/repos/asf/ambari/blob/8d7b9934/ambari-web/app/views/main/alert_definitions_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/main/alert_definitions_view.js b/ambari-web/app/views/main/alert_definitions_view.js
index 0b828c6..b8e8ef4 100644
--- a/ambari-web/app/views/main/alert_definitions_view.js
+++ b/ambari-web/app/views/main/alert_definitions_view.js
@@ -102,11 +102,35 @@ App.MainAlertDefinitionsView = App.TableView.extend({
   stateFilterView: filters.createSelectView({
     column: 2,
     fieldType: 'filter-input-width',
-    content: ['All', 'OK', 'WARNING', 'CRITICAL', 'DISABLED', 'UNKNOWN'],
+    content: [
+      {
+        value: '',
+        label: Em.I18n.t('common.all')
+      },
+      {
+        value: 'OK',
+        label: 'OK'
+      },
+      {
+        value: 'WARNING',
+        label: 'WARNING'
+      },
+      {
+        value: 'CRITICAL',
+        label: 'CRITICAL'
+      },
+      {
+        value: 'DISABLED',
+        label: 'DISABLED'
+      },
+      {
+        value: 'UNKNOWN',
+        label: 'UNKNOWN'
+      }
+    ],
     onChangeValue: function () {
-      this.get('parentView').updateFilter(this.get('column'), this.get('actualValue'), 'select');
-    },
-    emptyValue: Em.I18n.t('common.all')
+      this.get('parentView').updateFilter(this.get('column'), this.get('value'), 'select');
+    }
   }),
 
   /**
@@ -117,12 +141,21 @@ App.MainAlertDefinitionsView = App.TableView.extend({
     column: 3,
     fieldType: 'filter-input-width',
     content: function () {
-      return ['All'].concat(App.Service.find().mapProperty('serviceName'));
+      return [
+        {
+          value: '',
+          label: Em.I18n.t('common.all')
+        }
+      ].concat(App.Service.find().map(function (service) {
+        return {
+          value: service.get('serviceName'),
+          label: service.get('displayName')
+        }
+      }));
     }.property('App.router.clusterController.isLoaded'),
     onChangeValue: function () {
-      this.get('parentView').updateFilter(this.get('column'), this.get('actualValue'), 'select');
-    },
-    emptyValue: Em.I18n.t('common.all')
+      this.get('parentView').updateFilter(this.get('column'), this.get('value'), 'select');
+    }
   }),
 
   /**
@@ -139,7 +172,45 @@ App.MainAlertDefinitionsView = App.TableView.extend({
     ],
     appliedEmptyValue: ["", ""],
     fieldType: 'filter-input-width,modified-filter',
-    content: ['Any', 'Past 1 hour',  'Past 1 Day', 'Past 2 Days', 'Past 7 Days', 'Past 14 Days', 'Past 30 Days', 'Custom', 'Custom2'],
+    content: [
+      {
+        value: 'Any',
+        label: Em.I18n.t('any')
+      },
+      {
+        value: 'Past 1 hour',
+        label: 'Past 1 hour'
+      },
+      {
+        value: 'Past 1 Day',
+        label: 'Past 1 Day'
+      },
+      {
+        value: 'Past 2 Days',
+        label: 'Past 2 Days'
+      },
+      {
+        value: 'Past 7 Days',
+        label: 'Past 7 Days'
+      },
+      {
+        value: 'Past 14 Days',
+        label: 'Past 14 Days'
+      },
+      {
+        value: 'Past 30 Days',
+        label: 'Past 30 Days'
+      },
+      {
+        value: 'Custom',
+        label: 'Custom'
+      },
+      {
+        value: 'Custom2',
+        label: 'Custom2'
+      }
+    ],
+    emptyValue: 'Any',
     valueBinding: "controller.modifiedFilter.optionValue",
     startTimeBinding: "controller.modifiedFilter.actualValues.startTime",
     endTimeBinding: "controller.modifiedFilter.actualValues.endTime",

http://git-wip-us.apache.org/repos/asf/ambari/blob/8d7b9934/ambari-web/app/views/main/apps_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/main/apps_view.js b/ambari-web/app/views/main/apps_view.js
index 1190210..68241a1 100644
--- a/ambari-web/app/views/main/apps_view.js
+++ b/ambari-web/app/views/main/apps_view.js
@@ -164,7 +164,25 @@ App.MainAppsView = Em.View.extend({
   typeFilterView: filters.createSelectView({
     fieldType: 'input-small',
     valueBinding: "controller.filterObject.runType",
-    content: ['Any', 'Pig', 'Hive', 'MapReduce']
+    content: [
+      {
+        value: 'Any',
+        label: 'Any'
+      },
+      {
+        value: 'Pig',
+        label: 'Pig'
+      },
+      {
+        value: 'Hive',
+        label: 'Hive'
+      },
+      {
+        value: 'MapReduce',
+        label: 'MapReduce'
+      }
+    ],
+    emptyValue: 'Any'
   }),
 
   /**
@@ -244,7 +262,37 @@ App.MainAppsView = Em.View.extend({
   runDateFilterView: filters.createSelectView({
     fieldType: 'input-medium',
     valueBinding: "controller.filterObject.runDate",
-    content: ['Any', 'Past 1 Day', 'Past 2 Days', 'Past 7 Days', 'Past 14 Days', 'Past 30 Days']
+    content: [
+      {
+        value: 'Any',
+        label: Em.I18n.t('any')
+      },
+      {
+        value: 'Past 1 hour',
+        label: 'Past 1 hour'
+      },
+      {
+        value: 'Past 1 Day',
+        label: 'Past 1 Day'
+      },
+      {
+        value: 'Past 2 Days',
+        label: 'Past 2 Days'
+      },
+      {
+        value: 'Past 7 Days',
+        label: 'Past 7 Days'
+      },
+      {
+        value: 'Past 14 Days',
+        label: 'Past 14 Days'
+      },
+      {
+        value: 'Past 30 Days',
+        label: 'Past 30 Days'
+      }
+    ],
+    emptyValue: 'Any'
   }),
 
   /**

http://git-wip-us.apache.org/repos/asf/ambari/blob/8d7b9934/ambari-web/app/views/main/dashboard/config_history_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/main/dashboard/config_history_view.js b/ambari-web/app/views/main/dashboard/config_history_view.js
index 1f1d0b3..b82bca6 100644
--- a/ambari-web/app/views/main/dashboard/config_history_view.js
+++ b/ambari-web/app/views/main/dashboard/config_history_view.js
@@ -123,12 +123,21 @@ App.MainConfigHistoryView = App.TableView.extend({
     column: 1,
     fieldType: 'filter-input-width',
     content: function () {
-      return ['All'].concat(App.Service.find().mapProperty('serviceName'));
+      return [
+        {
+          value: '',
+          label: Em.I18n.t('common.all')
+        }
+      ].concat(App.Service.find().map(function (service) {
+        return {
+          value: service.get('serviceName'),
+          label: service.get('displayName')
+        }
+      }));
     }.property('App.router.clusterController.isLoaded'),
     onChangeValue: function () {
-      this.get('parentView').updateFilter(this.get('column'), this.get('actualValue'), 'select');
-    },
-    emptyValue: Em.I18n.t('common.all')
+      this.get('parentView').updateFilter(this.get('column'), this.get('value'), 'select');
+    }
   }),
 
   configGroupFilterView: filters.createSelectView({
@@ -136,22 +145,61 @@ App.MainConfigHistoryView = App.TableView.extend({
     fieldType: 'filter-input-width',
     content: function () {
       var groupName = App.ServiceConfigVersion.find().mapProperty('groupName').uniq();
-      if (groupName.indexOf(null) > -1 ){
+      if (groupName.indexOf(null) > -1) {
         groupName.splice(groupName.indexOf(null), 1);
       }
-      return ['All'].concat(groupName);
+      return [
+        {
+          value: '',
+          label: Em.I18n.t('common.all')
+        }
+      ].concat(groupName.map(function (item) {
+        return {
+          value: item,
+          label: item
+        }
+      }));
     }.property('App.router.mainConfigHistoryController.content'),
     onChangeValue: function () {
-      this.get('parentView').updateFilter(this.get('column'), this.get('actualValue'), 'select');
-    },
-    emptyValue: Em.I18n.t('common.all')
+      this.get('parentView').updateFilter(this.get('column'), this.get('value'), 'select');
+    }
   }),
 
   modifiedFilterView: filters.createSelectView({
     column: 3,
     appliedEmptyValue: ["", ""],
     fieldType: 'filter-input-width,modified-filter',
-    content: ['Any', 'Past 1 hour',  'Past 1 Day', 'Past 2 Days', 'Past 7 Days', 'Past 14 Days', 'Past 30 Days'],
+    content: [
+      {
+        value: 'Any',
+        label: Em.I18n.t('any')
+      },
+      {
+        value: 'Past 1 hour',
+        label: 'Past 1 hour'
+      },
+      {
+        value: 'Past 1 Day',
+        label: 'Past 1 Day'
+      },
+      {
+        value: 'Past 2 Days',
+        label: 'Past 2 Days'
+      },
+      {
+        value: 'Past 7 Days',
+        label: 'Past 7 Days'
+      },
+      {
+        value: 'Past 14 Days',
+        label: 'Past 14 Days'
+      },
+      {
+        value: 'Past 30 Days',
+        label: 'Past 30 Days'
+      }
+    ],
+    emptyValue: 'Any',
     valueBinding: "controller.modifiedFilter.optionValue",
     startTimeBinding: "controller.modifiedFilter.actualValues.startTime",
     endTimeBinding: "controller.modifiedFilter.actualValues.endTime",

http://git-wip-us.apache.org/repos/asf/ambari/blob/8d7b9934/ambari-web/app/views/main/host/stack_versions_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/main/host/stack_versions_view.js b/ambari-web/app/views/main/host/stack_versions_view.js
index cf6a06c..63151e0 100644
--- a/ambari-web/app/views/main/host/stack_versions_view.js
+++ b/ambari-web/app/views/main/host/stack_versions_view.js
@@ -67,12 +67,21 @@ App.MainHostStackVersionsView = App.TableView.extend({
     column: 1,
     fieldType: 'filter-input-width',
     content: function () {
-      return ['All'].concat(this.get('parentView.content').mapProperty('stack').uniq());
+      return [
+        {
+          value: '',
+          label: Em.I18n.t('common.all')
+        }
+      ].concat(this.get('parentView.content').mapProperty('stack').uniq().map(function (item) {
+        return {
+          value: item,
+          label: item
+        }
+      }));
     }.property('App.router.clusterController.isLoaded'),
     onChangeValue: function () {
-      this.get('parentView').updateFilter(this.get('column'), this.get('actualValue'), 'select');
-    },
-    emptyValue: 'All'
+      this.get('parentView').updateFilter(this.get('column'), this.get('value'), 'select');
+    }
   }),
 
   /**
@@ -83,12 +92,21 @@ App.MainHostStackVersionsView = App.TableView.extend({
     column: 2,
     fieldType: 'filter-input-width',
     content: function () {
-      return ['All'].concat(this.get('parentView.content').mapProperty('version'));
+      return [
+        {
+          value: '',
+          label: Em.I18n.t('common.all')
+        }
+      ].concat(this.get('parentView.content').map(function (item) {
+        return {
+          value: item.get('version'),
+          label: item.get('version')
+        }
+      }));
     }.property('App.router.clusterController.isLoaded'),
     onChangeValue: function () {
-      this.get('parentView').updateFilter(this.get('column'), this.get('actualValue'), 'select');
-    },
-    emptyValue: 'All'
+      this.get('parentView').updateFilter(this.get('column'), this.get('value'), 'select');
+    }
   }),
 
   /**
@@ -100,17 +118,31 @@ App.MainHostStackVersionsView = App.TableView.extend({
     fieldType: 'filter-input-width',
     content: function () {
       return [
-        'All',
-        'Installed',
-        'Installing',
-        'Install Failed',
-        'Uninstalled'
+        {
+          value: '',
+          label: Em.I18n.t('common.all')
+        },
+        {
+          value: 'INSTALLED',
+          label: Em.I18n.t('hosts.host.stackVersions.status.installed')
+        },
+        {
+          value: 'INSTALLING',
+          label: Em.I18n.t('hosts.host.stackVersions.status.installing')
+        },
+        {
+          value: 'INSTALL_FAILED',
+          label: Em.I18n.t('hosts.host.stackVersions.status.install_failed')
+        },
+        {
+          value: 'INIT',
+          label: Em.I18n.t('hosts.host.stackVersions.status.init')
+        }
       ];
     }.property('App.router.clusterController.isLoaded'),
     onChangeValue: function () {
-      this.get('parentView').updateFilter(this.get('column'), this.get('actualValue'), 'select');
-    },
-    emptyValue: 'All'
+      this.get('parentView').updateFilter(this.get('column'), this.get('value'), 'select');
+    }
   }),
 
   colPropAssoc: function () {

http://git-wip-us.apache.org/repos/asf/ambari/blob/8d7b9934/ambari-web/app/views/main/mirroring/datasets_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/main/mirroring/datasets_view.js b/ambari-web/app/views/main/mirroring/datasets_view.js
index 9dd1720..ea5f7a2 100644
--- a/ambari-web/app/views/main/mirroring/datasets_view.js
+++ b/ambari-web/app/views/main/mirroring/datasets_view.js
@@ -60,18 +60,26 @@ App.MainDatasetsView = App.TableView.extend({
   statusFilterView: filters.createSelectView({
     fieldType: 'input-small',
     column: 2,
-    content: ['Any', 'Scheduled', 'Suspended', 'Running'],
-    onClearValue: function () {
-      if (this.get('value') === '') {
-        this.set('value', 'Any');
+    content: [
+      {
+        value: '',
+        label: Em.I18n.t('any')
+      },
+      {
+        value: 'Scheduled',
+        label: 'Scheduled'
+      },
+      {
+        value: 'Suspended',
+        label: 'Suspended'
+      },
+      {
+        value: 'Running',
+        label: 'Running'
       }
-    }.observes('value'),
+    ],
     onChangeValue: function () {
-      var value = this.get('value');
-      if (value === 'Any') {
-        value = '';
-      }
-      this.get('parentView').updateFilter(this.get('column'), value, 'string');
+      this.get('parentView').updateFilter(this.get('column'), this.get('value'), 'string');
     }
   }),
 

http://git-wip-us.apache.org/repos/asf/ambari/blob/8d7b9934/ambari-web/app/views/main/mirroring/jobs_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/main/mirroring/jobs_view.js b/ambari-web/app/views/main/mirroring/jobs_view.js
index c8973d1..2e657f4 100644
--- a/ambari-web/app/views/main/mirroring/jobs_view.js
+++ b/ambari-web/app/views/main/mirroring/jobs_view.js
@@ -92,7 +92,33 @@ App.MainDatasetJobsView = App.TableView.extend({
   startFilterView: filters.createSelectView({
     fieldType: 'input-small',
     column: 2,
-    content: ['Any', 'Past 1 Day', 'Past 2 Days', 'Past 7 Days', 'Past 14 Days', 'Past 30 Days'],
+    content: [
+      {
+        value: 'Any',
+        label: Em.I18n.t('any')
+      },
+      {
+        value: 'Past 1 Day',
+        label: 'Past 1 Day'
+      },
+      {
+        value: 'Past 2 Days',
+        label: 'Past 2 Days'
+      },
+      {
+        value: 'Past 7 Days',
+        label: 'Past 7 Days'
+      },
+      {
+        value: 'Past 14 Days',
+        label: 'Past 14 Days'
+      },
+      {
+        value: 'Past 30 Days',
+        label: 'Past 30 Days'
+      }
+    ],
+    emptyValue: 'Any',
     onChangeValue: function () {
       this.get('parentView').updateFilter(this.get('column'), this.get('value'), 'date');
     }
@@ -101,7 +127,33 @@ App.MainDatasetJobsView = App.TableView.extend({
   endFilterView: filters.createSelectView({
     fieldType: 'input-small',
     column: 3,
-    content: ['Any', 'Past 1 Day', 'Past 2 Days', 'Past 7 Days', 'Past 14 Days', 'Past 30 Days'],
+    content: [
+      {
+        value: 'Any',
+        label: Em.I18n.t('any')
+      },
+      {
+        value: 'Past 1 Day',
+        label: 'Past 1 Day'
+      },
+      {
+        value: 'Past 2 Days',
+        label: 'Past 2 Days'
+      },
+      {
+        value: 'Past 7 Days',
+        label: 'Past 7 Days'
+      },
+      {
+        value: 'Past 14 Days',
+        label: 'Past 14 Days'
+      },
+      {
+        value: 'Past 30 Days',
+        label: 'Past 30 Days'
+      }
+    ],
+    emptyValue: 'Any',
     onChangeValue: function () {
       this.get('parentView').updateFilter(this.get('column'), this.get('value'), 'date');
     }
@@ -110,18 +162,38 @@ App.MainDatasetJobsView = App.TableView.extend({
   statusFilterView: filters.createSelectView({
     fieldType: 'input-small',
     column: 4,
-    content: ['Any', 'Waiting', 'Running', 'Suspended', 'Killed', 'Failed', 'Succeeded', 'Error'],
-    onClearValue: function () {
-      if (this.get('value') === '') {
-        this.set('value', 'Any');
+    content: [
+      {
+        value: '',
+        label: Em.I18n.t('any')
+      },
+      {
+        value: 'Waiting',
+        label: 'Waiting'
+      },
+      {
+        value: 'Running',
+        label: 'Running'
+      },
+      {
+        value: 'Suspended',
+        label: 'Suspended'
+      },
+      {
+        value: 'Killed',
+        label: 'Killed'
+      },
+      {
+        value: 'Succeeded',
+        label: 'Succeeded'
+      },
+      {
+        value: 'Error',
+        label: 'Error'
       }
-    }.observes('value'),
+    ],
     onChangeValue: function () {
-      var value = this.get('value');
-      if (value === 'Any') {
-        value = '';
-      }
-      this.get('parentView').updateFilter(this.get('column'), value, 'string');
+      this.get('parentView').updateFilter(this.get('column'), this.get('value'), 'string');
     }
   }),