Author: yusaku
Date: Sat Jan 19 01:11:14 2013
New Revision: 1435436
URL: http://svn.apache.org/viewvc?rev=1435436&view=rev
Log:
AMBARI-1216. Add filters module. (yusaku)
Added:
incubator/ambari/trunk/ambari-web/app/templates/main/host/component_filter.hbs
incubator/ambari/trunk/ambari-web/app/views/common/filter_view.js
Modified:
incubator/ambari/trunk/CHANGES.txt
incubator/ambari/trunk/ambari-web/app/controllers/main/host.js
incubator/ambari/trunk/ambari-web/app/styles/application.less
incubator/ambari/trunk/ambari-web/app/templates/main/host.hbs
incubator/ambari/trunk/ambari-web/app/views/main/host.js
Modified: incubator/ambari/trunk/CHANGES.txt
URL:
http://svn.apache.org/viewvc/incubator/ambari/trunk/CHANGES.txt?rev=1435436&r1=1435435&r2=1435436&view=diff
==============================================================================
--- incubator/ambari/trunk/CHANGES.txt (original)
+++ incubator/ambari/trunk/CHANGES.txt Sat Jan 19 01:11:14 2013
@@ -17,6 +17,8 @@ Trunk (unreleased changes):
IMPROVEMENTS
+ AMBARI-1216. Add filters module. (yusaku)
+
AMBARI-1215. Refactor hostComponent isSlaves and isMaster and add update
methods for server mapper. (yusaku)
Modified: incubator/ambari/trunk/ambari-web/app/controllers/main/host.js
URL:
http://svn.apache.org/viewvc/incubator/ambari/trunk/ambari-web/app/controllers/main/host.js?rev=1435436&r1=1435435&r2=1435436&view=diff
==============================================================================
--- incubator/ambari/trunk/ambari-web/app/controllers/main/host.js (original)
+++ incubator/ambari/trunk/ambari-web/app/controllers/main/host.js Sat Jan 19
01:11:14 2013
@@ -32,7 +32,7 @@ App.MainHostController = Em.ArrayControl
var installedComponents = componentHelper.getInstalledComponents();
installedComponents.setEach('checkedForHostFilter', false);
return installedComponents;
- }.property(),
+ }.property('App.router.clusterController.isLoaded'),
masterComponents:function () {
return this.get('componentsForFilter').filterProperty('isMaster', true);
Modified: incubator/ambari/trunk/ambari-web/app/styles/application.less
URL:
http://svn.apache.org/viewvc/incubator/ambari/trunk/ambari-web/app/styles/application.less?rev=1435436&r1=1435435&r2=1435436&view=diff
==============================================================================
--- incubator/ambari/trunk/ambari-web/app/styles/application.less (original)
+++ incubator/ambari/trunk/ambari-web/app/styles/application.less Sat Jan 19
01:11:14 2013
@@ -1263,7 +1263,7 @@ a:focus {
margin: 4px 5px 0 0;
width: 13px;
}
- ul#filter-dropdown {
+ ul.filter-components {
padding: 5px 0;
li {
display: block;
@@ -1275,10 +1275,7 @@ a:focus {
}
input[type="checkbox"] {
- margin-top: 0;
- margin-right: 2px;
- margin-bottom: 2px;
- margin: 0 2px 2px;
+ margin: 4px 4px 2px 2px;
}
}
&>li {
@@ -2326,12 +2323,6 @@ ul.inline li {
max-height: none;
}
-
-// Get checkboxes to line up with text in components dropdown on Hosts page
-#hosts .table ul#filter-dropdown li input[type="checkbox"] {
- margin: 4px 4px 2px 2px;
-}
-
i.icon-asterisks {
color: #FF4B4B;
}
Modified: incubator/ambari/trunk/ambari-web/app/templates/main/host.hbs
URL:
http://svn.apache.org/viewvc/incubator/ambari/trunk/ambari-web/app/templates/main/host.hbs?rev=1435436&r1=1435435&r2=1435436&view=diff
==============================================================================
--- incubator/ambari/trunk/ambari-web/app/templates/main/host.hbs (original)
+++ incubator/ambari/trunk/ambari-web/app/templates/main/host.hbs Sat Jan 19
01:11:14 2013
@@ -41,16 +41,15 @@
<th></th>
<th></th>
</tr>
+ <tr>
<th class="first"> </th>
- <th class="notActive"><div class="view-wrapper">{{view
view.nameFilterView viewName="nameFilterViewInstance"}}</div> <a href="#"
{{action "clearFilterButtonClick" target="view"}}
id="view_nameFilterViewInstance" class="ui-icon ui-icon-circle-close
ui-name"></a></th>
- <th class="notActive"><div class="view-wrapper">{{view
view.rackFilterView viewName="ipFilterViewInstance"}}</div> <a href="#"
{{action "clearFilterButtonClick" target="view"}}
id="view_ipFilterViewInstance" class="ui-icon ui-icon-circle-close
ui-rack"></a></th>
- <th class="notActive"><div class="view-wrapper">{{view
view.cpuFilterView viewName="cpuFilterViewInstance"}}</div> <a href="#"
{{action "clearFilterButtonClick" target="view"}}
id="view_cpuFilterViewInstance" class="ui-icon ui-icon-circle-close
ui-cpu"></a></th>
- <th class="notActive"><div class="view-wrapper">{{view
view.ramFilterView viewName="ramFilterViewInstance"}}</div> <a href="#"
{{action "clearFilterButtonClick" target="view"}}
id="view_ramFilterViewInstance" class="ui-icon ui-icon-circle-close
ui-ram"></a></th>
+ <th>{{view view.nameFilterView}}</th>
+ <th>{{view view.ipFilterView}}</th>
+ <th>{{view view.cpuFilterView}}</th>
+ <th>{{view view.ramFilterView}}</th>
<th></th>
- <th class="notActive"><div class="view-wrapper">{{view
view.loadAvgFilterView viewName="loadAvgFilterViewInstance"}}</div> <a href="#"
{{action "clearFilterButtonClick" target="view"}}
id="view_loadAvgFilterViewInstance" class="ui-icon ui-icon-circle-close
ui-load_avg"></a></th>
- <th class="notActive"><input id="components_filter" type="hidden" />
- <div class="view-wrapper">{{view view.componentsFilterView
viewName="componentsFilterViewInstance"}}</div> <a href="#" {{action
"clearFilterButtonClick" target="view"}} id="view_componentsFilterViewInstance"
class="ui-icon ui-icon-circle-close ui-components"></a>
- </th>
+ <th>{{view view.loadAvgFilterView}}</th>
+ <th>{{view view.componentsFilterView}}</th>
<th></th>
<th></th>
</tr>
Added:
incubator/ambari/trunk/ambari-web/app/templates/main/host/component_filter.hbs
URL:
http://svn.apache.org/viewvc/incubator/ambari/trunk/ambari-web/app/templates/main/host/component_filter.hbs?rev=1435436&view=auto
==============================================================================
---
incubator/ambari/trunk/ambari-web/app/templates/main/host/component_filter.hbs
(added)
+++
incubator/ambari/trunk/ambari-web/app/templates/main/host/component_filter.hbs
Sat Jan 19 01:11:14 2013
@@ -0,0 +1,80 @@
+{{!
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements. See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership. The ASF licenses this file
+* to you under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance
+* with the License. You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+}}
+
+<div {{bindAttr class="view.btnGroupClass"}}>
+ <button class="btn btn-info single-btn-group" {{action "clickFilterButton"
target="view"}}>
+ Components <span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu filter-components">
+ <li>
+ <ul>
+ <li>
+ <label class="checkbox">
+ {{view Ember.Checkbox
checkedBinding="view.allComponentsChecked"}} All
+ </label>
+ </li>
+ <li>
+ <label class="checkbox">
+ {{view Ember.Checkbox
checkedBinding="view.masterComponentsChecked"}} Master Components:
+ </label>
+ <ul>
+ {{#each component in masterComponents}}
+ <li>
+ <label class="checkbox">
+ {{view Ember.Checkbox
checkedBinding="component.checkedForHostFilter" }} {{unbound
component.displayName}}
+ </label>
+ </li>
+ {{/each}}
+ </ul>
+ </li>
+ <li>
+ <label class="checkbox">
+ {{view Ember.Checkbox
checkedBinding="view.slaveComponentsChecked"}} Slave Components:
+ </label>
+ <ul>
+ {{#each component in slaveComponents}}
+ <li>
+ <label class="checkbox">
+ {{view Ember.Checkbox
checkedBinding="component.checkedForHostFilter" }} {{unbound
component.displayName}}
+ </label>
+ </li>
+ {{/each}}
+ </ul>
+ </li>
+ <li>
+ <label class="checkbox">
+ {{view Ember.Checkbox
checkedBinding="view.clientComponentsChecked"}} Client Components:
+ </label>
+ <ul>
+ {{#each component in clientComponents}}
+ <li>
+ <label class="checkbox">
+ {{view Ember.Checkbox
checkedBinding="component.checkedForHostFilter" }} {{unbound
component.displayName}}
+ </label>
+ </li>
+ {{/each}}
+ </ul>
+ </li>
+ </ul>
+ </li>
+ <li>
+ <button class="btn" {{action "closeFilters"
target="view"}}>Cancel</button>
+ <button class="btn btn-primary" {{action "applyFilter"
target="view"}}>Apply</button>
+ </li>
+ </ul>
+</div>
\ No newline at end of file
Added: incubator/ambari/trunk/ambari-web/app/views/common/filter_view.js
URL:
http://svn.apache.org/viewvc/incubator/ambari/trunk/ambari-web/app/views/common/filter_view.js?rev=1435436&view=auto
==============================================================================
--- incubator/ambari/trunk/ambari-web/app/views/common/filter_view.js (added)
+++ incubator/ambari/trunk/ambari-web/app/views/common/filter_view.js Sat Jan
19 01:11:14 2013
@@ -0,0 +1,225 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var wrapperView = Ember.View.extend({
+ classNames: ['view-wrapper'],
+ layout: Ember.Handlebars.compile('<a href="#" {{action "clearFilter"
target="view"}} class="ui-icon ui-icon-circle-close ui-name"></a> {{yield}}'),
+ template: Ember.Handlebars.compile('{{#if view.fieldId}}<input type="hidden"
id="{{unbound view.fieldId}}" value="" />{{/if}} {{view view.filterView}}'),
+
+ value: null,
+
+ clearFilter: function(){
+ this.set('value', this.get('emptyValue'));
+ return false;
+ },
+
+ emptyValue: '',
+
+ isEmpty: function(){
+ if(this.get('value') === null){
+ return true;
+ }
+ return this.get('value').toString() === this.get('emptyValue').toString();
+ },
+
+ showClearFilter: function(){
+ if(!this.get('parentNode')){
+ return;
+ }
+
+ if(this.isEmpty()){
+ this.get('parentNode').addClass('notActive');
+ } else {
+ this.get('parentNode').removeClass('notActive');
+ }
+
+ if(this.get('fieldId')){
+ this.$('> input').eq(0).val(this.get('value'));
+ }
+
+ this.onChangeValue();
+ }.observes('value'),
+
+ /**
+ * Callback for value changes
+ */
+ onChangeValue: function(){
+
+ },
+
+ filterView: Em.View,
+
+ init: function(){
+ this.set('value', this.get('emptyValue'));
+ this._super();
+ },
+
+ didInsertElement: function(){
+ var parent = this.$().parent();
+ this.set('parentNode', parent);
+ parent.addClass('notActive');
+ }
+});
+
+var textFieldView = Ember.TextField.extend({
+ type:'text',
+ placeholder: 'Any',
+ valueBinding: "parentView.value"
+});
+
+var componentFieldView = Ember.View.extend({
+ templateName: require('templates/main/host/component_filter'),
+ classNames: ['btn-group'],
+ classNameBindings: ['open'],
+ multiple: true,
+
+ isFilterOpen: false,
+
+ btnGroupClass:function () {
+ return this.get('isFilterOpen') ? 'btn-group open' : 'btn-group';
+ }.property('isFilterOpen'),
+
+ valueBinding: 'parentView.value',
+ masterComponentsBinding: 'controller.masterComponents',
+ slaveComponentsBinding: 'controller.slaveComponents',
+ clientComponentsBinding: 'controller.clientComponents',
+
+ allComponentsChecked:false,
+ toggleAllComponents:function () {
+ var checked = this.get('allComponentsChecked');
+ this.set('masterComponentsChecked', checked);
+ this.set('slaveComponentsChecked', checked);
+ this.set('clientComponentsChecked', checked);
+ }.observes('allComponentsChecked'),
+
+ masterComponentsChecked:false,
+ toggleMasterComponents:function () {
+ this.get('masterComponents').setEach('checkedForHostFilter',
this.get('masterComponentsChecked'));
+ }.observes('masterComponentsChecked'),
+
+ slaveComponentsChecked:false,
+ toggleSlaveComponents:function () {
+ this.get('slaveComponents').setEach('checkedForHostFilter',
this.get('slaveComponentsChecked'));
+ }.observes('slaveComponentsChecked'),
+
+ clientComponentsChecked: false,
+ toggleClientComponents: function() {
+ this.get('clientComponents').setEach('checkedForHostFilter',
this.get('clientComponentsChecked'));
+ }.observes('clientComponentsChecked'),
+
+ /**
+ * Clear filter to initial state
+ */
+ clearFilter:function() {
+ this.set('allComponentsChecked', false);
+ this.set('masterComponentsChecked', false);
+ this.set('slaveComponentsChecked', false);
+ this.set('clientComponentsChecked', false);
+
+ this.get('masterComponents').setEach('checkedForHostFilter', false);
+ this.get('slaveComponents').setEach('checkedForHostFilter', false);
+ this.get('clientComponents').setEach('checkedForHostFilter', false);
+ this.set('value', []);
+ },
+
+ /**
+ * Onclick handler for <code>cancel filter</code> button
+ */
+ closeFilters:function () {
+ $(document).unbind('click');
+ this.set('isFilterOpen', false);
+ },
+
+ /**
+ * Onclick handler for <code>apply filter</code> button
+ */
+ applyFilter:function() {
+ this.closeFilters();
+
+ var chosenComponents = [];
+
+ this.get('masterComponents').filterProperty('checkedForHostFilter',
true).forEach(function(item){
+ chosenComponents.push(item.get('displayName'));
+ });
+ this.get('slaveComponents').filterProperty('checkedForHostFilter',
true).forEach(function(item){
+ chosenComponents.push(item.get('displayName'));
+ });
+ this.get('clientComponents').filterProperty('checkedForHostFilter',
true).forEach(function(item){
+ chosenComponents.push(item.get('displayName'));
+ });
+ this.set('value', chosenComponents);
+ },
+
+ /**
+ * Onclick handler for <code>show component filter</code> button.
+ * Also this function is used in some other places
+ */
+ clickFilterButton:function () {
+ var self = this;
+ this.set('isFilterOpen', !this.get('isFilterOpen'));
+ if (this.get('isFilterOpen')) {
+
+ var dropDown = this.$('.filter-components');
+ var firstClick = true;
+ $(document).bind('click', function (e) {
+ if (!firstClick && $(e.target).closest(dropDown).length == 0) {
+ self.set('isFilterOpen', false);
+ $(document).unbind('click');
+ }
+ firstClick = false;
+ });
+ }
+ },
+
+ didInsertElement:function () {
+ if (this.get('controller.comeWithFilter')) {
+ this.applyFilter();
+ this.set('controller.comeWithFilter', false);
+ } else {
+ this.clearFilter();
+ }
+ }
+});
+
+module.exports = {
+ wrapperView : wrapperView,
+
+ createTextView : function(config){
+
+ config.fieldType = config.fieldType || 'input-medium';
+ config.filterView = textFieldView.extend({
+ classNames : [ config.fieldType ]
+ });
+
+ return wrapperView.extend(config);
+ },
+ createComponentView : function(config){
+ config.filterView = componentFieldView;
+ config.emptyValue = [];
+ config.clearFilter = function(){
+ this.forEachChildView(function(item){
+ if(item.clearFilter){
+ item.clearFilter();
+ }
+ });
+ return false;
+ };
+
+ return wrapperView.extend(config);
+ }
+};
\ No newline at end of file
Modified: incubator/ambari/trunk/ambari-web/app/views/main/host.js
URL:
http://svn.apache.org/viewvc/incubator/ambari/trunk/ambari-web/app/views/main/host.js?rev=1435436&r1=1435435&r2=1435436&view=diff
==============================================================================
--- incubator/ambari/trunk/ambari-web/app/views/main/host.js (original)
+++ incubator/ambari/trunk/ambari-web/app/views/main/host.js Sat Jan 19
01:11:14 2013
@@ -18,6 +18,7 @@
var App = require('app');
require('utils/data_table');
+var filters = require('views/common/filter_view');
App.MainHostView = Em.View.extend({
templateName:require('templates/main/host'),
@@ -97,297 +98,61 @@ App.MainHostView = Em.View.extend({
}),
- nameFilterView: Em.TextField.extend({
- classNames:['input-medium'],
- type:'text',
- placeholder: 'Any Name',
- filtering:function(){
- if (this.get('value') == '') {
- this.$().closest('th').addClass('notActive');
- }
- else {
- this.$().closest('th').removeClass('notActive');
- }
- this.get('parentView').get('applyFilter')(this.get('parentView'), 8,
this.get('value'));
- }.observes('value')
+ nameFilterView: filters.createTextView({
+ onChangeValue: function(){
+ this.get('parentView').updateFilter(8, this.get('value'));
+ }
}),
- rackFilterView: Em.TextField.extend({
- classNames:['input-medium'],
- type:'text',
- placeholder: 'Any Name',
- filtering:function(){
- if (this.get('value') == '') {
- this.$().closest('th').addClass('notActive');
- }
- else {
- this.$().closest('th').removeClass('notActive');
- }
- this.get('parentView').get('applyFilter')(this.get('parentView'), 2,
this.get('value'));
- }.observes('value')
- }),
- /**
- * Filter-field for cpu
- */
- cpuFilterView: Em.TextField.extend({
- classNames:['input-mini'],
- type:'text',
- placeholder: 'Any ',
- elementId:'cpu_filter',
- filtering:function(){
- if (this.get('value') == '') {
- this.$().closest('th').addClass('notActive');
- }
- else {
- this.$().closest('th').removeClass('notActive');
- }
- this.get('parentView').get('applyFilter')(this.get('parentView'), 3);
- }.observes('value')
- }),
- /**
- * Filter-field for load avg
- */
- loadAvgFilterView: Em.TextField.extend({
- classNames:['input-mini'],
- type:'text',
- placeholder: 'Any ',
- elementId:'load_avg_filter',
- filtering:function(){
- if (this.get('value') == '') {
- this.$().closest('th').addClass('notActive');
- }
- else {
- this.$().closest('th').removeClass('notActive');
- }
- this.get('parentView').get('applyFilter')(this.get('parentView'), 5);
- }.observes('value')
- }),
- /**
- * Filter-field for RAM
- */
- ramFilterView: Em.TextField.extend({
- classNames:['input-mini'],
- type:'text',
- placeholder: 'Any ',
- elementId: 'ram_filter',
- filtering:function(){
- if (this.get('value') == '') {
- this.$().closest('th').addClass('notActive');
- }
- else {
- this.$().closest('th').removeClass('notActive');
- }
- this.get('parentView').get('applyFilter')(this.get('parentView'), 4);
- }.observes('value')
+ ipFilterView: filters.createTextView({
+ onChangeValue: function(){
+ this.get('parentView').updateFilter(2, this.get('value'));
+ }
}),
- /**
- * Filter-list for Components
- */
- componentsFilterView: Em.View.extend({
- classNames:['btn-group'],
- classNameBindings: ['open'],
- multiple:true,
- open: false,
-
- isFilterOpen:false,
-
- btnGroupClass:function () {
- return this.get('isFilterOpen') ? 'btn-group open' : 'btn-group';
- }.property('isFilterOpen'),
-
- allComponentsChecked:false,
- toggleAllComponents:function () {
- var checked = this.get('allComponentsChecked');
- this.set('masterComponentsChecked', checked);
- this.set('slaveComponentsChecked', checked);
- this.set('clientComponentsChecked', checked);
- }.observes('allComponentsChecked'),
-
- masterComponentsChecked:false,
- toggleMasterComponents:function () {
- this.get('masterComponents').setEach('checkedForHostFilter',
this.get('masterComponentsChecked'));
- }.observes('masterComponentsChecked'),
-
- slaveComponentsChecked:false,
- toggleSlaveComponents:function () {
- this.get('slaveComponents').setEach('checkedForHostFilter',
this.get('slaveComponentsChecked'));
- }.observes('slaveComponentsChecked'),
-
- clientComponentsChecked: false,
- toggleClientComponents: function() {
- this.get('clientComponents').setEach('checkedForHostFilter',
this.get('clientComponentsChecked'));
- }.observes('clientComponentsChecked'),
-
- masterComponents:function(){
- return this.get('parentView.controller.masterComponents');
- }.property('parentView.controller.masterComponents'),
-
- slaveComponents:function(){
- return this.get('parentView.controller.slaveComponents');
- }.property('parentView.controller.slaveComponents'),
-
- clientComponents: function() {
- return this.get('parentView.controller.clientComponents');
- }.property('parentView.controller.clientComponents'),
-
- template: Ember.Handlebars.compile('<div {{bindAttr
class="view.btnGroupClass"}} >'+
- '<button class="btn btn-info single-btn-group" {{action
"clickFilterButton" target="view"}}>' +
- 'Components ' +
- '<span class="caret"></span>' +
- '</button>' +
- '<ul class="dropdown-menu filter-components" id="filter-dropdown">' +
- '<li>' +
- '<ul>' +
- '<li>' +
- '<label class="checkbox">' +
- '{{view Ember.Checkbox
checkedBinding="view.allComponentsChecked"}} All' +
- '</label>' +
- '</li>' +
- '<li>' +
- '<label class="checkbox">' +
- '{{view Ember.Checkbox
checkedBinding="view.masterComponentsChecked"}} Master Components:' +
- '</label>' +
- '<ul>' +
- '{{#each component in masterComponents}}' +
- '<li>' +
- '<label class="checkbox">' +
- '{{view Ember.Checkbox
checkedBinding="component.checkedForHostFilter" }} {{unbound
component.displayName}}' +
- '</label>' +
- ' </li>' +
- '{{/each}}' +
- '</ul>' +
- '</li>' +
- '<li>' +
- '<label class="checkbox">' +
- '{{view Ember.Checkbox
checkedBinding="view.slaveComponentsChecked"}} Slave Components:' +
- '</label>' +
- '<ul>' +
- '{{#each component in slaveComponents}}' +
- '<li>' +
- '<label class="checkbox">' +
- '{{view Ember.Checkbox
checkedBinding="component.checkedForHostFilter" }} {{unbound
component.displayName}}' +
- '</label>' +
- '</li>' +
- '{{/each}}' +
- '</ul>' +
- '</li>' +
- '<li>' +
- '<label class="checkbox">' +
- '{{view Ember.Checkbox
checkedBinding="view.clientComponentsChecked"}} Client Components:' +
- '</label>' +
- '<ul>' +
- '{{#each component in clientComponents}}' +
- '<li>' +
- '<label class="checkbox">' +
- '{{view Ember.Checkbox
checkedBinding="component.checkedForHostFilter" }} {{unbound
component.displayName}}' +
- '</label>' +
- '</li>' +
- '{{/each}}' +
- '</ul>' +
- '</li>' +
- '</ul>' +
- '</li>' +
- '<li>' +
- '<button class="btn" {{action "closeFilters" target="view"}}>' +
- 'Cancel' +
- '</button> ' +
- '<button class="btn btn-primary" {{action "applyFilter"
target="view"}}>' +
- 'Apply' +
- '</button>' +
- '</li>' +
- '</ul>' +
- '</div>'),
-
- clearFilter:function(self) {
- self.set('allComponentsChecked', true);
- self.set('allComponentsChecked', false);
- jQuery('#components_filter').val([]);
- self.get('parentView').get('oTable').fnFilter('', 6);
- jQuery('#components_filter').closest('th').addClass('notActive');
- },
- closeFilters:function () {
- $(document).unbind('click');
- this.clickFilterButton();
- },
-
- clickFilterButton:function () {
- var self = this;
- this.set('isFilterOpen', !this.get('isFilterOpen'));
- if (this.get('isFilterOpen')) {
-
- var dropDown = $('#filter-dropdown');
- var firstClick = true;
- $(document).bind('click', function (e) {
- if (!firstClick && $(e.target).closest(dropDown).length == 0) {
- self.set('isFilterOpen', false);
- $(document).unbind('click');
- }
- firstClick = false;
- });
- }
- },
-
- didInsertElement:function () {
- if (this.get('controller.comeWithFilter')) {
- this.applyFilter();
- this.closeFilters();
- this.set('controller.comeWithFilter', false);
- } else {
- this.clearFilter(this);
- }
- },
-
- applyFilter:function() {
- var chosenComponents = new Array();
- this.set('isFilterOpen', !this.get('isFilterOpen'));
- this.get('masterComponents').forEach(function(item){
- if(item.get('checkedForHostFilter'))
chosenComponents.push(item.get('displayName'));
- });
- this.get('slaveComponents').forEach(function(item){
- if(item.get('checkedForHostFilter'))
chosenComponents.push(item.get('displayName'));
- });
- this.get('clientComponents').forEach(function(item){
- if(item.get('checkedForHostFilter'))
chosenComponents.push(item.get('displayName'));
- });
- jQuery('#components_filter').val(chosenComponents);
- this.get('parentView').get('applyFilter')(this.get('parentView'), 9);
- if (chosenComponents.length == 0) {
- this.$().closest('th').addClass('notActive');
- }
- else {
- this.$().closest('th').removeClass('notActive');
- }
+ cpuFilterView: filters.createTextView({
+ fieldType: 'input-mini',
+ fieldId: 'cpu_filter',
+ onChangeValue: function(){
+ this.get('parentView').updateFilter(3);
}
}),
- /**
- * Clear selected filter
- * @param event
- */
- clearFilterButtonClick: function(event) {
- var viewName = event.target.id.replace('view_', '');
- var elementId = this.get(viewName).get('elementId');
- if(this.get(viewName).get('tagName') === 'input') {
- this.get(viewName).set('value', '');
+
+ loadAvgFilterView: filters.createTextView({
+ fieldType: 'input-mini',
+ fieldId: 'load_avg_filter',
+ onChangeValue: function(){
+ this.get('parentView').updateFilter(5);
}
- if(this.get(viewName).get('tagName') === 'select') {
- this.get(viewName).set('value', 'Any');
- this.get(viewName).change();
+ }),
+
+ ramFilterView: filters.createTextView({
+ fieldType: 'input-mini',
+ fieldId: 'ram_filter',
+ onChangeValue: function(){
+ this.get('parentView').updateFilter(4);
}
- if(this.get(viewName).get('multiple')) {
- this.get(viewName).get('clearFilter')(this.get(viewName));
+ }),
+
+ componentsFilterView: filters.createComponentView({
+ fieldId: 'components_filter',
+ onChangeValue: function(){
+ this.get('parentView').updateFilter(9);
}
- },
+ }),
+
+ startIndex : function(){
+ return Math.random();
+ }.property(),
+
/**
- * apply each filter to dataTable
+ * Apply each filter to dataTable
*
- * @param {parentView}
- * @param {iColumn} number of column by which filter
- * @param {value}
+ * @param iColumn number of column by which filter
+ * @param value
*/
- applyFilter:function(parentView, iColumn, value) {
- value = (value) ? value : '';
- parentView.get('oTable').fnFilter(value, iColumn);
+ updateFilter: function(iColumn, value){
+ this.get('oTable').fnFilter(value || '', iColumn);
}
-});
\ No newline at end of file
+});
