window.components = window.components || {}
window.components.collection_table = {
- oncreate: function(vnode) {
- vnode.state.autoload = function() {
- if (!vnode.attrs.loader.loadMore)
- // Can't load more content anyway: no point in
- // checking anything else.
- return
- var contentRect = vnode.dom.getBoundingClientRect()
- var scroller = window // TODO: use vnode.dom's nearest ancestor with scrollbars
- if (contentRect.bottom < 2 * scroller.innerHeight) {
- // We have less than 1 page worth of content available
- // below the visible area. Load more.
- vnode.attrs.loader.loadMore()
- // Indicate loading is in progress.
- window.requestAnimationFrame(m.redraw)
- }
+ maybeLoadMore: function(dom) {
+ var loader = this.loader
+ if (loader.done || !loader.loadMore)
+ // Can't load more content anyway: no point in
+ // checking anything else.
+ return
+ var contentRect = dom.getBoundingClientRect()
+ var scroller = window // TODO: use dom's nearest ancestor with scrollbars
+ if (contentRect.bottom < 2 * scroller.innerHeight) {
+ // We have less than 1 page worth of content available
+ // below the visible area. Load more.
+ loader.loadMore()
+ // Indicate loading is in progress.
+ window.requestAnimationFrame(m.redraw)
}
- window.addEventListener('scroll', vnode.state.autoload)
- window.addEventListener('resize', vnode.state.autoload)
- vnode.state.autoloadTimer = window.setInterval(vnode.state.autoload, 200)
+ },
+ oncreate: function(vnode) {
+ vnode.state.maybeLoadMore = vnode.state.maybeLoadMore.bind(vnode.state, vnode.dom)
+ window.addEventListener('scroll', vnode.state.maybeLoadMore)
+ window.addEventListener('resize', vnode.state.maybeLoadMore)
+ vnode.state.timer = window.setInterval(vnode.state.maybeLoadMore, 200)
+ vnode.state.onupdate(vnode)
+ },
+ onupdate: function(vnode) {
+ vnode.state.loader = vnode.attrs.loader
},
onremove: function(vnode) {
- window.clearInterval(vnode.state.autoloadTimer)
- window.removeEventListener('scroll', vnode.state.autoload)
- window.removeEventListener('resize', vnode.state.autoload)
+ window.clearInterval(vnode.state.timer)
+ window.removeEventListener('scroll', vnode.state.maybeLoadMore)
+ window.removeEventListener('resize', vnode.state.maybeLoadMore)
},
view: function(vnode) {
return m('table.table.table-condensed', [
}),
]),
m('tfoot', m('tr', [
- m('th[colspan=4]', m('button.btn.btn-xs', {
+ vnode.attrs.loader.done ? null : m('th[colspan=4]', m('button.btn.btn-xs', {
className: vnode.attrs.loader.loadMore ? 'btn-primary' : 'btn-default',
style: {
display: 'block',
done: false,
items: m.stream(),
thresholdItem: null,
- loadNextPage: function() {
+ loadMore: function() {
// Get the next page, if there are any more items to get.
if (pager.done)
return
Object.assign(loader, config, {
// Sorted items ready to display, merged from all pagers.
displayable: [],
+ done: false,
pagers: {},
loadMore: false,
// Number of undisplayed items to keep on hand for each result
m.stream.merge(Object.keys(sessions).map(function(key) {
var pager = new window.models.Pager(loader.loadFunc.bind(null, sessions[key]))
loader.pagers[key] = pager
- pager.loadNextPage()
+ pager.loadMore()
// Resolve the stream with the session key when the results
// arrive.
return pager.items.map(function() { return key })
if (!loader.pagers[key].done)
loadable.push(loader.pagers[key])
})
- if (loadable.length == 0)
+ if (loadable.length == 0) {
+ loader.done = true
loader.loadMore = false
- else
+ } else
loader.loadMore = function() {
loader.loadMore = false
loadable.map(function(pager) {
if (pager.items().length - pager.itemsDisplayed < loader.lowWaterMark)
- pager.loadNextPage()
+ pager.loadMore()
})
}
})