Repository: hadoop Updated Branches: refs/heads/trunk fa4ecd8b9 -> 880cd754a
YARN-7536. em-table improvement for better filtering in new YARN UI. Contributed by Vasudevan Skm. This closes #313. Project: http://git-wip-us.apache.org/repos/asf/hadoop/repo Commit: http://git-wip-us.apache.org/repos/asf/hadoop/commit/880cd754 Tree: http://git-wip-us.apache.org/repos/asf/hadoop/tree/880cd754 Diff: http://git-wip-us.apache.org/repos/asf/hadoop/diff/880cd754 Branch: refs/heads/trunk Commit: 880cd754a542ac33855dd26e2e8cc26909acacb9 Parents: fa4ecd8b Author: Sunil G <[email protected]> Authored: Wed Dec 13 16:46:12 2017 +0530 Committer: Sunil G <[email protected]> Committed: Wed Dec 13 16:46:12 2017 +0530 ---------------------------------------------------------------------- .../webapp/app/controllers/yarn-nodes/table.js | 1 + .../webapp/app/controllers/yarn-services.js | 1 + .../src/main/webapp/app/styles/app.scss | 80 +------------ .../src/main/webapp/app/styles/em-table.scss | 119 +++++++++++++++++++ 4 files changed, 122 insertions(+), 79 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/hadoop/blob/880cd754/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/controllers/yarn-nodes/table.js ---------------------------------------------------------------------- diff --git a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/controllers/yarn-nodes/table.js b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/controllers/yarn-nodes/table.js index 24e3878..7aeae19 100644 --- a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/controllers/yarn-nodes/table.js +++ b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/controllers/yarn-nodes/table.js @@ -31,6 +31,7 @@ export default Ember.Controller.extend({ rowCount: Ember.computed.alias('tableDefinition.rowCount'), tableDefinition: TableDefinition.create({ enableFaceting: true, + minValuesToDisplay: 1, rowCount: 25 }), columns: function() { http://git-wip-us.apache.org/repos/asf/hadoop/blob/880cd754/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/controllers/yarn-services.js ---------------------------------------------------------------------- diff --git a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/controllers/yarn-services.js b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/controllers/yarn-services.js index e0ee4a5..0f7a330 100644 --- a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/controllers/yarn-services.js +++ b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/controllers/yarn-services.js @@ -26,6 +26,7 @@ export default AppTableController.extend({ sortColumnId: 'stTime', sortOrder: 'desc', rowCount: 25, + minValuesToDisplay: 1, enableFaceting: true }), searchText: Ember.computed.alias('tableDefinition.searchText'), http://git-wip-us.apache.org/repos/asf/hadoop/blob/880cd754/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/styles/app.scss ---------------------------------------------------------------------- diff --git a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/styles/app.scss b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/styles/app.scss index 87ee9a9..3919ac3 100644 --- a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/styles/app.scss +++ b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/styles/app.scss @@ -2,6 +2,7 @@ @import 'layout.scss'; @import 'yarn-app.scss'; @import './compose-box.scss'; +@import 'em-table.scss'; /** * Licensed to the Apache Software Foundation (ASF) under one @@ -657,81 +658,6 @@ div.service-action-mask img { z-index: 9999; } -.yarn-applications-container .table-panel-left .em-table-facet-panel { - width: 240px; - margin-right: 15px; - padding: 0 0 15px 0; - background: none; - border: none; - border-radius: 0; -} - -.yarn-applications-container .table-panel-left .em-table-facet-panel .field-list > li .em-table-facet-panel-values{ - margin-top: 0px; - margin-bottom: -4px; - background: $yarn-panel-bg; - border: 1px solid $yarn-border-color; -} - -.yarn-applications-container .table-panel-left .em-table-facet-panel .field-name { - background-color: $yarn-header-bg; - border-bottom: 1px solid $yarn-border-color; - padding: 10px 15px; -} - -.yarn-applications-container .table-panel-left .em-table-facet-panel .all-button { - right: 5px !important; -} - -.yarn-applications-container .table-panel-left .em-table-facet-panel .field-name::before { - margin-right: 5px; -} - -.yarn-applications-container .table-panel-left .em-table-facet-panel .value-list { - padding: 0 10px; -} - -.yarn-applications-container .table-panel-left .em-table-facet-panel .filter-box { - padding: 5px; - margin: 5px 0; -} - -.yarn-applications-container .table-panel-left .em-table-facet-panel .more-less { - padding: 5px 0; -} - -.yarn-applications-container .table-panel-left .em-table-facet-panel .field-list { - padding-top: 0px; -} - -.yarn-applications-container .em-table .table-column .table-header-cell { - padding: 7.5px 0 7.5px 7.5px; -} - -.yarn-applications-container .ember-view.table-cell { - padding: 10px 15px; - height: auto; -} - -.yarn-applications-container .resize-column { - position: absolute; - right: -14px; - display: inline-block; - padding: 10px 0; - top: -36px; - font-size: 42px; - line-height: 2em; -} - -.yarn-app-body > div:not(:first-child) { - margin-top: 15px; -} - -.em-table .table-column .table-header-cell { - background-color: $yarn-header-bg; - border-bottom: 1px solid $yarn-border-color; -} - .muted-text { color: $yarn-muted-text; } @@ -756,10 +682,6 @@ div.service-action-mask img { overflow: scroll; } -.flex { - display: flex; -} - .yarn-label { border-radius: 3px; margin-bottom: 5px; http://git-wip-us.apache.org/repos/asf/hadoop/blob/880cd754/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/styles/em-table.scss ---------------------------------------------------------------------- diff --git a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/styles/em-table.scss b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/styles/em-table.scss new file mode 100644 index 0000000..83667fc --- /dev/null +++ b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/styles/em-table.scss @@ -0,0 +1,119 @@ +/** + * 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. + */ + +// All emtable style overrides go here + +.yarn-applications-container { + .table-panel-left { + .em-table-facet-panel { + width: 240px; + margin-right: 15px; + padding: 0 0 15px 0; + background: none; + border: none; + border-radius: 0; + .field-list { + padding-top: 0px; + + & > li .em-table-facet-panel-values { + margin-top: 0px; + margin-bottom: -4px; + background: $yarn-panel-bg; + border: 1px solid $yarn-border-color; + .field-name { + cursor: default; + &::before { + display: none; + } + .all-button { + display: block; + cursor: pointer; + } + } + + &.hide-values { + .value-list, + .more-less, + .field-name .all-button { + display: block; + } + &.hide-select-all { + .field-name .all-button { + display: none; + } + } + } + } + } + + .field-name { + background-color: $yarn-header-bg; + border-bottom: 1px solid $yarn-border-color; + padding: 10px 15px; + } + .all-button { + right: 5px !important; + } + + .field-name::before { + margin-right: 5px; + } + + .value-list { + padding: 0 10px; + } + + .filter-box { + padding: 5px; + margin: 5px 0; + } + + .more-less { + padding: 5px 0; + } + } + } + + .ember-view.table-cell { + padding: 10px 15px; + height: auto; + } + + .resize-column { + position: absolute; + right: -14px; + display: inline-block; + padding: 10px 0; + top: -36px; + font-size: 42px; + line-height: 2em; + } + .em-progress-container { + padding-bottom: 1px; + } +} + +.em-table { + .table-column { + .table-header-cell { + padding: 7.5px 0 7.5px 7.5px; + background-color: $yarn-header-bg; + border-bottom: 1px solid $yarn-border-color; + } + } +} --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
