forked from Addepar/ember-table
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request Addepar#39 from li-qiang/refactor-grouped-row-chil…
…dren-loading Can lazily load grouping-row and its children
- Loading branch information
Showing
4 changed files
with
157 additions
and
18 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,32 @@ | ||
import Ember from 'ember'; | ||
import LazyGroupRowArray from './lazy-group-row-array'; | ||
|
||
export default Ember.ObjectProxy.extend({ | ||
|
||
loadChildren: Ember.K, | ||
|
||
groupingMetadata: null, | ||
|
||
groupingLevel: 0, | ||
|
||
groupingName: Ember.computed(function () { | ||
return Ember.get(this.get('groupingMetadata').objectAt(this.get('groupingLevel')), 'id'); | ||
}).property('groupingMetadata', 'groupingLevel'), | ||
|
||
selfQuery: Ember.computed(function () { | ||
var query = {}; | ||
var groupingName = this.get('groupingName'); | ||
query[groupingName] = this.get('content.id'); | ||
return Ember.setProperties(query, this.get('parentQuery') || {}); | ||
}).property('content'), | ||
|
||
children: Ember.computed(function () { | ||
var lazyArray = LazyGroupRowArray.create({ | ||
loadChildren: this.loadChildren, | ||
groupingLevel: this.get('groupingLevel') + 1, | ||
groupingMetadata: this.get('groupingMetadata'), | ||
parentQuery: this.get('selfQuery') | ||
}); | ||
return lazyArray; | ||
}).property() | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,102 @@ | ||
import Ember from 'ember'; | ||
import GroupingRowProxy from './grouping-row-proxy'; | ||
|
||
export default Ember.ArrayProxy.extend({ | ||
loadChildren: Ember.K, | ||
groupingLevel: 0, | ||
groupingMetadata: null, | ||
parentQuery: {}, | ||
|
||
init: function () { | ||
this.set('content', Ember.A()); | ||
this._super(); | ||
this.addLoadingPlaceHolder(); | ||
}, | ||
|
||
loadOneChunk: function(chunkIndex) { | ||
return this.loadChildren(chunkIndex, this.get('parentQuery') || {}); | ||
}, | ||
wrapLoadedContent: function (row) { | ||
if (this.get('isGroupingRow')) { | ||
var groupingMetadata = this.get('groupingMetadata'); | ||
return GroupingRowProxy.create({ | ||
groupingMetadata: groupingMetadata, | ||
groupingLevel: this.get('groupingLevel'), | ||
content: row, | ||
loadChildren: this.loadChildren, | ||
parentQuery: this.get('parentQuery') | ||
}); | ||
} else { | ||
return row; | ||
} | ||
}, | ||
|
||
/*---------------Override ArrayProxy -----------------------*/ | ||
objectAtContent: function (index) { | ||
var object = this._super(index); | ||
if (object.get('isLoading') && !this.get('_hasInProgressLoading')) { | ||
this.triggerLoading(index); | ||
} | ||
return object; | ||
}, | ||
|
||
/*---------------Private methods -----------------------*/ | ||
isGroupingRow: Ember.computed(function() { | ||
return this.get('groupingLevel') < this.get('groupingMetadata.length'); | ||
}).property('groupingMetadata.[]', 'groupingLevel'), | ||
|
||
triggerLoading: function (index) { | ||
this.set('_hasInProgressLoading', true); | ||
var chunkIndex = this.chunkIndex(index); | ||
var self = this; | ||
this.loadOneChunk(chunkIndex).then(function (result) { | ||
self.onOneChunkLoaded(result); | ||
self.set('_hasInProgressLoading', false); | ||
}); | ||
}, | ||
|
||
chunkIndex: function (index) { | ||
var chunkSize = this.get('chunkSize'); | ||
if (!chunkSize) { | ||
return 0; | ||
} | ||
return Math.floor(index / chunkSize); | ||
}, | ||
|
||
onOneChunkLoaded: function (result) { | ||
this.setProperties(result.meta); | ||
var chunk = result.content; | ||
if (chunk.get('length') > 0) { | ||
this.updatePlaceHolderWithContent(this.wrapLoadedContent(chunk.get('firstObject'))); | ||
var self = this; | ||
var chunkObjects = chunk.slice(1).map(function (x) { | ||
return Ember.ObjectProxy.create({"isLoaded": true, "isError": false, "content": self.wrapLoadedContent(x)}); | ||
}); | ||
this.pushObjects(chunkObjects); | ||
if (this.get('length') < this.get('totalCount')) { | ||
this.addLoadingPlaceHolder(); | ||
} | ||
} else { | ||
this.removeObject(this.get('lastObject')); | ||
} | ||
}, | ||
|
||
addLoadingPlaceHolder: function () { | ||
this.pushObject(Ember.ObjectProxy.create({"isLoading": true, "isLoaded": false})); | ||
}, | ||
|
||
updatePlaceHolderWithContent: function (content) { | ||
var lastObject = this.get('lastObject'); | ||
lastObject.setProperties({ | ||
'content': content, | ||
'isLoading': false, | ||
'isLoaded': true | ||
}); | ||
}, | ||
|
||
totalCount: null, | ||
|
||
chunkSize: null, | ||
|
||
_hasInProgressLoading: false | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters