Updated Branches: refs/heads/trunk 89cb9704c -> 6050e5ea1
AMBARI-3790. Cleanup component filtering dialog control. (Jeff Sposetti via yusaku) Project: http://git-wip-us.apache.org/repos/asf/incubator-ambari/repo Commit: http://git-wip-us.apache.org/repos/asf/incubator-ambari/commit/6050e5ea Tree: http://git-wip-us.apache.org/repos/asf/incubator-ambari/tree/6050e5ea Diff: http://git-wip-us.apache.org/repos/asf/incubator-ambari/diff/6050e5ea Branch: refs/heads/trunk Commit: 6050e5ea14922fb6572ec2925a59ccb6db31bc64 Parents: 89cb970 Author: Yusaku Sako <yus...@hortonworks.com> Authored: Tue Nov 19 13:41:19 2013 -0800 Committer: Yusaku Sako <yus...@hortonworks.com> Committed: Tue Nov 19 13:41:19 2013 -0800 ---------------------------------------------------------------------- ambari-web/app/messages.js | 1 + ambari-web/app/styles/application.less | 51 +++++++++- .../templates/main/host/component_filter.hbs | 102 ++++++++++--------- 3 files changed, 101 insertions(+), 53 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/incubator-ambari/blob/6050e5ea/ambari-web/app/messages.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/messages.js b/ambari-web/app/messages.js index 3cc8bdc..3f4af4b 100644 --- a/ambari-web/app/messages.js +++ b/ambari-web/app/messages.js @@ -1625,6 +1625,7 @@ Em.I18n.translations = { 'apps.filters.filteredHostsInfo': '{0} of {1} hosts showing - ', 'apps.filters.customRunDate':'Run Date custom filter', 'apps.filters.nothingToShow': 'No jobs to display', + 'apps.filters.filterComponents': 'Filter by <strong>Component</strong>', 'apps.dagCharts.popup':'Job Charts', 'apps.dagCharts.popup.job': 'Job', 'apps.dagCharts.popup.dag':'Job Timeline', http://git-wip-us.apache.org/repos/asf/incubator-ambari/blob/6050e5ea/ambari-web/app/styles/application.less ---------------------------------------------------------------------- diff --git a/ambari-web/app/styles/application.less b/ambari-web/app/styles/application.less index db514f3..29b6e1b 100644 --- a/ambari-web/app/styles/application.less +++ b/ambari-web/app/styles/application.less @@ -2541,6 +2541,9 @@ table.graphs { padding-left: 6px; text-align: left; width: 100px; + .icon-filter { + color: #999999; + } } } thead { @@ -2757,22 +2760,64 @@ table.graphs { } ul.filter-components { padding: 5px 0; + background: #777777; + color: #ffffff; + font-weight: normal; + font-size: 12px; + label { + font-size: 12px; + } li { display: block; padding: 3px 0 3px 5px; line-height: 20px; - label.checkbox { padding-left: 3px; } - input[type="checkbox"] { margin: 4px 4px 2px 2px; } } + li#title-bar { + text-align: left; + border-bottom: 1px solid #e4e4e4; + a.close { + background: #777777; + display: inline; + color: #ffffff; + padding-left: 35px; + padding-right: 12px; + text-shadow: 0 1px 0 #ffffff; + float: none; + font-size: 10px; + opacity: 0.6; + } + a.close:hover { + background: #777777; + opacity: 1.0; + } + } + li#selector-bar { + text-align: left; + border-bottom: 1px solid #e4e4e4; + font-size: 6px; + } + li#list-area { + font-weight: normal; + text-align: left; + } + li#button-bar { + text-align: center; + button { + font-size: 12px; + } + } + ul { + margin-left: 10px; + } &>li { &>ul { - height: 250px; + height: 150px; margin-left: 0; overflow-y: scroll; } http://git-wip-us.apache.org/repos/asf/incubator-ambari/blob/6050e5ea/ambari-web/app/templates/main/host/component_filter.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/main/host/component_filter.hbs b/ambari-web/app/templates/main/host/component_filter.hbs index 8a1ea49..ca71b79 100644 --- a/ambari-web/app/templates/main/host/component_filter.hbs +++ b/ambari-web/app/templates/main/host/component_filter.hbs @@ -16,56 +16,58 @@ * limitations under the License. }} - <button class="btn single-btn-group filter-btn" {{action "clickFilterButton" target="view"}}><i class="icon-filter"></i> {{t apps.filters.filter}}</button> +<button class="btn single-btn-group filter-btn" {{action "clickFilterButton" target="view"}}>{{t apps.filters.filter}} <i class="icon-filter"></i></button> <ul class="dropdown-menu filter-components"> - <li> + <li id="title-bar">{{t apps.filters.filterComponents}} + <a class="close" {{action "closeFilter" target="view"}}>X</a> + </li> + <li id="list-area"> + <ul> + <li> + <label class="checkbox"> + {{view Ember.Checkbox checkedBinding="view.masterComponentsChecked"}} {{t host.host.componentFilter.master}}: + </label> <ul> - <li> - <label class="checkbox"> - {{view Ember.Checkbox checkedBinding="view.masterComponentsChecked"}} {{t host.host.componentFilter.master}}: - </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"}} {{t host.host.componentFilter.slave}}: - </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"}} {{t host.host.componentFilter.client}}: - </label> - <ul> - {{#each component in clientComponents}} - <li> - <label class="checkbox"> - {{view Ember.Checkbox checkedBinding="component.checkedForHostFilter" }} {{unbound component.displayName}} - </label> - </li> - {{/each}} - </ul> - </li> + {{#each component in masterComponents}} + <li> + <label class="checkbox"> + {{view Ember.Checkbox checkedBinding="component.checkedForHostFilter" }} {{unbound component.displayName}} + </label> + </li> + {{/each}} </ul> - </li> - <li> - <button class="btn" {{action "closeFilter" target="view"}}>{{t common.cancel}}</button> - <button class="btn btn-primary" {{action "applyFilter" target="view"}}>{{t common.apply}}</button> - </li> - </ul> \ No newline at end of file + </li> + <li> + <label class="checkbox"> + {{view Ember.Checkbox checkedBinding="view.slaveComponentsChecked"}} {{t host.host.componentFilter.slave}}: + </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"}} {{t host.host.componentFilter.client}}: + </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 id="button-bar"> + <button class="btn btn-inverse" {{action "applyFilter" target="view"}}>{{t common.apply}}</button> + </li> + </ul>