forked from cybrespace/pinafore
spoiler button is faster now
This commit is contained in:
parent
d682982a54
commit
c67ba5c0a9
|
@ -55,11 +55,13 @@
|
|||
},
|
||||
methods: {
|
||||
onClickSpoilerButton() {
|
||||
let uuid = this.get('uuid')
|
||||
let $spoilersShown = this.store.get('spoilersShown')
|
||||
$spoilersShown[uuid] = !$spoilersShown[uuid]
|
||||
this.store.set({'spoilersShown': $spoilersShown})
|
||||
this.fire('recalculateHeight')
|
||||
requestAnimationFrame(() => {
|
||||
let uuid = this.get('uuid')
|
||||
let $spoilersShown = this.store.get('spoilersShown')
|
||||
$spoilersShown[uuid] = !$spoilersShown[uuid]
|
||||
this.store.set({'spoilersShown': $spoilersShown})
|
||||
this.fire('recalculateHeight')
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -28,7 +28,13 @@
|
|||
|
||||
export default {
|
||||
oncreate() {
|
||||
this.doRecalculateHeight()
|
||||
let asyncLayout = new AsyncLayout(node => node.getAttribute('virtual-list-key'))
|
||||
let key = this.get('key')
|
||||
asyncLayout.observe(key, this.refs.node, (rect) => {
|
||||
asyncLayout.disconnect()
|
||||
// update all item heights in one batch for better perf
|
||||
this.store.batchUpdateForRealm('itemHeights', key, rect.height)
|
||||
})
|
||||
},
|
||||
store: () => virtualListStore,
|
||||
computed: {
|
||||
|
@ -36,13 +42,13 @@
|
|||
},
|
||||
methods: {
|
||||
doRecalculateHeight() {
|
||||
let asyncLayout = new AsyncLayout(node => node.getAttribute('virtual-list-key'))
|
||||
// Recalculate immediately because this is done on-demand, e.g.
|
||||
// when clicking the "More" button on a spoiler.
|
||||
let rect = this.refs.node.getBoundingClientRect()
|
||||
let key = this.get('key')
|
||||
asyncLayout.observe(key, this.refs.node, (rect) => {
|
||||
asyncLayout.disconnect()
|
||||
// update all item heights in one batch for better perf
|
||||
this.store.batchUpdateForRealm('itemHeights', key, rect.height)
|
||||
})
|
||||
let itemHeights = this.store.get('itemHeights')
|
||||
itemHeights[key] = rect.height
|
||||
this.store.setForRealm({itemHeights})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue