PERF: Only render 30 site settings in "All" when filtering

This commit is contained in:
Robin Ward 2015-09-29 13:34:09 -04:00
parent 8e86dbe560
commit 3cd23b45af
4 changed files with 20 additions and 18 deletions

View file

@ -5,7 +5,7 @@ export default Ember.ArrayController.extend({
onlyOverridden: false, onlyOverridden: false,
filtered: Ember.computed.notEmpty('filter'), filtered: Ember.computed.notEmpty('filter'),
filterContentNow: function(category) { filterContentNow(category) {
// If we have no content, don't bother filtering anything // If we have no content, don't bother filtering anything
if (!!Ember.isEmpty(this.get('allSiteSettings'))) return; if (!!Ember.isEmpty(this.get('allSiteSettings'))) return;
@ -20,12 +20,13 @@ export default Ember.ArrayController.extend({
return; return;
} }
const self = this, const all = {nameKey: 'all_results', name: I18n.t('admin.site_settings.categories.all_results'), siteSettings: []};
matchesGroupedByCategory = [{nameKey: 'all_results', name: I18n.t('admin.site_settings.categories.all_results'), siteSettings: []}]; const matchesGroupedByCategory = [all];
this.get('allSiteSettings').forEach(function(settingsCategory) { const matches = [];
const matches = settingsCategory.siteSettings.filter(function(item) { this.get('allSiteSettings').forEach(settingsCategory => {
if (self.get('onlyOverridden') && !item.get('overridden')) return false; const siteSettings = settingsCategory.siteSettings.filter(item => {
if (this.get('onlyOverridden') && !item.get('overridden')) return false;
if (filter) { if (filter) {
if (item.get('setting').toLowerCase().indexOf(filter) > -1) return true; if (item.get('setting').toLowerCase().indexOf(filter) > -1) return true;
if (item.get('setting').toLowerCase().replace(/_/g, ' ').indexOf(filter) > -1) return true; if (item.get('setting').toLowerCase().replace(/_/g, ' ').indexOf(filter) > -1) return true;
@ -36,16 +37,20 @@ export default Ember.ArrayController.extend({
return true; return true;
} }
}); });
if (matches.length > 0) { if (siteSettings.length > 0) {
matchesGroupedByCategory[0].siteSettings.pushObjects(matches); matches.pushObjects(siteSettings);
matchesGroupedByCategory.pushObject({ matchesGroupedByCategory.pushObject({
nameKey: settingsCategory.nameKey, nameKey: settingsCategory.nameKey,
name: I18n.t('admin.site_settings.categories.' + settingsCategory.nameKey), name: I18n.t('admin.site_settings.categories.' + settingsCategory.nameKey),
siteSettings: matches siteSettings,
count: siteSettings.length
}); });
} }
}); });
all.siteSettings.pushObjects(matches.slice(0, 30));
all.count = matches.length;
this.set('model', matchesGroupedByCategory); this.set('model', matchesGroupedByCategory);
this.transitionToRoute("adminSiteSettingsCategory", category || "all_results"); this.transitionToRoute("adminSiteSettingsCategory", category || "all_results");
}, },
@ -60,10 +65,7 @@ export default Ember.ArrayController.extend({
actions: { actions: {
clearFilter() { clearFilter() {
this.setProperties({ this.setProperties({ filter: '', onlyOverridden: false });
filter: '',
onlyOverridden: false
});
}, },
toggleMenu() { toggleMenu() {

View file

@ -2,7 +2,7 @@
<h3>{{unbound settingName}}</h3> <h3>{{unbound settingName}}</h3>
</div> </div>
<div class="setting-value"> <div class="setting-value">
{{component componentName setting=setting value=buffered.value validationMessage=validationMessage}} {{component componentName setting=setting value=buffered.value validationMessage=validationMessage}}
</div> </div>
{{#if dirty}} {{#if dirty}}
<div class='setting-controls'> <div class='setting-controls'>

View file

@ -1,6 +1,6 @@
{{#if filteredContent}} {{#if filteredContent}}
<div class='form-horizontal settings'> <div class='form-horizontal settings'>
{{#each setting in filteredContent}} {{#each filteredContent as |setting|}}
{{site-setting setting=setting saveAction="saveSetting"}} {{site-setting setting=setting saveAction="saveSetting"}}
{{/each}} {{/each}}
</div> </div>

View file

@ -6,9 +6,9 @@
</label> </label>
</div> </div>
<div class='controls'> <div class='controls'>
<button {{action "toggleMenu"}} class="menu-toggle">{{fa-icon "bars"}}</button> {{d-button action="toggleMenu" class="menu-toggle" icon="bars"}}
{{text-field value=filter placeholderKey="type_to_filter" class="no-blur"}} {{text-field value=filter placeholderKey="type_to_filter" class="no-blur"}}
<button {{action "clearFilter"}} class="btn">{{i18n 'admin.site_settings.clear_filter'}}</button> {{d-button action="clearFilter" label="admin.site_settings.clear_filter"}}
</div> </div>
</div> </div>
@ -19,7 +19,7 @@
{{#link-to 'adminSiteSettingsCategory' category.nameKey class=category.nameKey}} {{#link-to 'adminSiteSettingsCategory' category.nameKey class=category.nameKey}}
{{category.name}} {{category.name}}
{{#if filtered}} {{#if filtered}}
<span class="count">({{category.siteSettings.length}})</span> <span class="count">({{category.count}})</span>
{{/if}} {{/if}}
{{/link-to}} {{/link-to}}
{{/link-to}} {{/link-to}}