AMBARI-18790. Implement lazy loading for Service configs Advanced tab (akovalenko)
Project: http://git-wip-us.apache.org/repos/asf/ambari/repo Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/0c165e33 Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/0c165e33 Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/0c165e33 Branch: refs/heads/branch-dev-patch-upgrade Commit: 0c165e3368a9be1a4b023b129632bf4ba2b2b90e Parents: 9881409 Author: Aleksandr Kovalenko <[email protected]> Authored: Thu Nov 3 19:31:20 2016 +0200 Committer: Aleksandr Kovalenko <[email protected]> Committed: Fri Nov 4 01:13:09 2016 +0200 ---------------------------------------------------------------------- .../templates/common/configs/service_config.hbs | 16 +---- ambari-web/app/views.js | 1 + .../configs/config_category_container_view.js | 64 ++++++++++++++++++++ .../configs/service_configs_by_category_view.js | 42 ++++++------- .../notification_configs_view_test.js | 6 +- 5 files changed, 92 insertions(+), 37 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ambari/blob/0c165e33/ambari-web/app/templates/common/configs/service_config.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/common/configs/service_config.hbs b/ambari-web/app/templates/common/configs/service_config.hbs index ed70f8c..d25515a 100644 --- a/ambari-web/app/templates/common/configs/service_config.hbs +++ b/ambari-web/app/templates/common/configs/service_config.hbs @@ -134,13 +134,7 @@ <div {{bindAttr class=":tab-pane tab.isActive:active tab.id"}}> {{#if tab.isAdvanced}} {{#if tab.isRendered}} - {{#each category in selectedService.configCategories}} - {{#if category.isCustomView}} - {{view category.customView categoryBinding="category" serviceBinding="selectedService" canEditBinding="view.canEdit" serviceConfigsBinding="selectedService.configs"}} - {{else}} - {{view App.ServiceConfigsByCategoryView categoryBinding="category" canEditBinding="view.canEdit" serviceBinding="selectedService" serviceConfigsBinding="selectedService.configs" supportsHostOverridesBinding="view.supportsHostOverrides"}} - {{/if}} - {{/each}} + {{view App.ConfigCategoryContainerView categoriesBinding="selectedService.configCategories" canEditBinding="view.canEdit" serviceBinding="selectedService" serviceConfigsBinding="selectedService.configs" supportsHostOverridesBinding="view.supportsHostOverrides"}} {{else}} {{view App.SpinnerView}} {{/if}} @@ -152,13 +146,7 @@ {{/each}} </div> {{else}} - {{#each category in selectedService.configCategories}} - {{#if category.isCustomView}} - {{view category.customView categoryBinding="category" serviceBinding="selectedService" canEditBinding="view.canEdit" serviceConfigsBinding="selectedService.configs"}} - {{else}} - {{view App.ServiceConfigsByCategoryView categoryBinding="category" canEditBinding="view.canEdit" serviceBinding="selectedService" serviceConfigsBinding="selectedService.configs" supportsHostOverridesBinding="view.supportsHostOverrides"}} - {{/if}} - {{/each}} + {{view App.ConfigCategoryContainerView categoriesBinding="selectedService.configCategories" canEditBinding="view.canEdit" serviceBinding="selectedService" serviceConfigsBinding="selectedService.configs" supportsHostOverridesBinding="view.supportsHostOverrides"}} {{/if}} {{#if view.isAllConfigsHidden}} <div class="alert alert-info col-sm-12"> http://git-wip-us.apache.org/repos/asf/ambari/blob/0c165e33/ambari-web/app/views.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/views.js b/ambari-web/app/views.js index d713db1..a04dcc4 100644 --- a/ambari-web/app/views.js +++ b/ambari-web/app/views.js @@ -65,6 +65,7 @@ require('views/common/configs/service_config_container_view'); require('views/common/configs/service_configs_by_category_view'); require('views/common/configs/service_config_view'); require('views/common/configs/service_config_tab_view'); +require('views/common/configs/config_category_container_view'); require('views/common/configs/overriddenPropertyRow_view'); require('views/common/configs/overriddenProperty_view'); require('views/common/configs/compare_property_view'); http://git-wip-us.apache.org/repos/asf/ambari/blob/0c165e33/ambari-web/app/views/common/configs/config_category_container_view.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/views/common/configs/config_category_container_view.js b/ambari-web/app/views/common/configs/config_category_container_view.js new file mode 100644 index 0000000..08cdb2c --- /dev/null +++ b/ambari-web/app/views/common/configs/config_category_container_view.js @@ -0,0 +1,64 @@ +/** + * 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 App = require('app'); + +var lazyLoading = require('utils/lazy_loading'); + +App.ConfigCategoryContainerView = Em.ContainerView.extend({ + + lazyLoading: null, + + categories: [], + + didInsertElement: function () { + this.pushViews(); + this._super(); + }, + + willDestroyElement: function () { + if (this.get('lazyLoading')) { + lazyLoading.terminate(this.get('lazyLoading')) + } + this._super(); + }, + + pushViews: function () { + var self = this; + var categoriesViews = []; + this.get('categories').forEach(function (category) { + var viewClass = category.isCustomView ? category.customView : App.ServiceConfigsByCategoryView; + categoriesViews.push(viewClass.create({ + category: category, + canEdit: self.get("canEdit"), + service: self.get("service"), + serviceConfigs: self.get("serviceConfigs"), + supportsHostOverrides: self.get("supportsHostOverrides") + })); + }); + this.set('lazyLoading', lazyLoading.run({ + destination: self.get('childViews'), + source: categoriesViews, + initSize: 3, + chunkSize: 3, + delay: 200, + context: this + })); + } + +}); http://git-wip-us.apache.org/repos/asf/ambari/blob/0c165e33/ambari-web/app/views/common/configs/service_configs_by_category_view.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/views/common/configs/service_configs_by_category_view.js b/ambari-web/app/views/common/configs/service_configs_by_category_view.js index 3a898e2..baf7852 100644 --- a/ambari-web/app/views/common/configs/service_configs_by_category_view.js +++ b/ambari-web/app/views/common/configs/service_configs_by_category_view.js @@ -68,24 +68,24 @@ App.ServiceConfigsByCategoryView = Em.View.extend(App.UserPref, App.ConfigOverri var self = this; // If `this.categoryConfigsAll` is a computed property then don't set it. // some extended class like `App.NotificationsConfigsView` overrides `categoryConfigsAll` as computed property - if ($.isArray(this.categoryConfigsAll)) { - this.setCategoryConfigsAll(); - } - this.setVisibleCategoryConfigs(); - var isCollapsed = this.calcIsCollapsed(); - this.set('category.isCollapsed', isCollapsed); - if (isCollapsed) { - this.$('.accordion-body').hide(); - } - else { - this.$('.accordion-body').show(); - } - $('#serviceConfig').tooltip({ - selector: '[data-toggle=tooltip]', - placement: 'top' - }); - this.filteredCategoryConfigs(); Em.run.next(function () { + if ($.isArray(self.categoryConfigsAll)) { + self.setCategoryConfigsAll(); + } + self.setVisibleCategoryConfigs(); + var isCollapsed = self.calcIsCollapsed(); + self.set('category.isCollapsed', isCollapsed); + if (isCollapsed) { + self.$('.accordion-body').hide(); + } + else { + self.$('.accordion-body').show(); + } + $('#serviceConfig').tooltip({ + selector: '[data-toggle=tooltip]', + placement: 'top' + }); + self.filteredCategoryConfigs(); self.updateReadOnlyFlags(); }); }, @@ -171,9 +171,9 @@ App.ServiceConfigsByCategoryView = Em.View.extend(App.UserPref, App.ConfigOverri var hasFilteredAdvancedConfigs = this.get('categoryConfigs').filter(function (config) { return config.get('isHiddenByFilter') === false && Em.isNone(config.get('widget')); }, this).length > 0; - return (isCustomPropertiesCategory && this.get('controller.filter') === '' && !this.get('parentView.columns').someProperty('selected')) || + return (isCustomPropertiesCategory && this.get('controller.filter') === '' && !this.get('parentView.parentView.columns').someProperty('selected')) || hasFilteredAdvancedConfigs; - }.property('category.customCanAddProperty', '[email protected]', '[email protected]', 'controller.filter', '[email protected]'), + }.property('category.customCanAddProperty', '[email protected]', '[email protected]', 'controller.filter', '[email protected]'), /** * Re-order the configs to list content displayType properties at last in the category @@ -317,7 +317,7 @@ App.ServiceConfigsByCategoryView = Em.View.extend(App.UserPref, App.ConfigOverri collapseCategory: function () { if (this.get('state') === 'destroyed') return; $('.popover').remove(); - var filter = this.get('parentView.filter').toLowerCase(); + var filter = this.get('parentView.parentView.filter').toLowerCase(); var filteredResult = this.get('categoryConfigs'); var isInitialRendering = !arguments.length || arguments[1] != 'categoryConfigs'; @@ -640,7 +640,7 @@ App.ServiceConfigsByCategoryView = Em.View.extend(App.UserPref, App.ConfigOverri var controller = (App.router.get('currentState.name') == 'configs') ? App.router.get('mainServiceInfoConfigsController') : App.router.get('wizardStep7Controller'); - this.get('parentView').onClose(); + this.get('parentView.parentView').onClose(); controller.set('filter', event.view.get('serviceConfigObj.name')); } }) http://git-wip-us.apache.org/repos/asf/ambari/blob/0c165e33/ambari-web/test/views/common/configs/custom_category_views/notification_configs_view_test.js ---------------------------------------------------------------------- diff --git a/ambari-web/test/views/common/configs/custom_category_views/notification_configs_view_test.js b/ambari-web/test/views/common/configs/custom_category_views/notification_configs_view_test.js index b970c89..681d346 100644 --- a/ambari-web/test/views/common/configs/custom_category_views/notification_configs_view_test.js +++ b/ambari-web/test/views/common/configs/custom_category_views/notification_configs_view_test.js @@ -32,8 +32,10 @@ function getView() { categoryConfigs: [], categoryConfigsAll: [], parentView: Em.View.create({ - filter: '', - columns: [] + parentView: Em.View.create({ + filter: '', + columns: [] + }) }) }); }
