Revert "chore(store): clean up usage of svelte store (#713)" (#725)

This reverts commit 36d90d34e5.

Fixes #724
This commit is contained in:
Nolan Lawson 2018-12-04 07:24:55 -08:00 committed by GitHub
parent 618ea31a57
commit d83d7322dc
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 21 additions and 11 deletions

View file

@ -63,20 +63,26 @@
this.store.setForRealm({ items: newItems }) this.store.setForRealm({ items: newItems })
stop('set items') stop('set items')
}) })
this.store.observe('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight => { this.observe('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight => {
if (allVisibleItemsHaveHeight) { if (allVisibleItemsHaveHeight) {
this.fire('initializedVisibleItems') this.fire('initializedVisibleItems')
} }
}) })
let observedOnce = false
this.observe('distanceFromBottom', (distanceFromBottom) => { this.observe('distanceFromBottom', (distanceFromBottom) => {
if (!observedOnce) {
observedOnce = true // TODO: the first time is always 0... need better way to handle this
return
}
if (distanceFromBottom >= 0 && if (distanceFromBottom >= 0 &&
distanceFromBottom <= DISTANCE_FROM_BOTTOM_TO_FIRE) { distanceFromBottom <= DISTANCE_FROM_BOTTOM_TO_FIRE) {
this.fireScrollToBottom() this.fireScrollToBottom()
} }
}, { init: false }) })
this.store.observe('scrollTop', (scrollTop) => { this.observe('scrollTop', (scrollTop) => {
this.fire('scrollTopChanged', scrollTop) this.fire('scrollTopChanged', scrollTop)
if (scrollTop === 0) { if (scrollTop === 0) {
this.fireScrollToTop() this.fireScrollToTop()
@ -97,7 +103,10 @@
computed: { computed: {
distanceFromBottom: ({ $scrollHeight, $scrollTop, $offsetHeight }) => { distanceFromBottom: ({ $scrollHeight, $scrollTop, $offsetHeight }) => {
return $scrollHeight - $scrollTop - $offsetHeight return $scrollHeight - $scrollTop - $offsetHeight
} },
scrollTop: ({ $scrollTop }) => $scrollTop,
// TODO: bug in svelte store, shouldn't need to do this
allVisibleItemsHaveHeight: ({ $allVisibleItemsHaveHeight }) => $allVisibleItemsHaveHeight
}, },
methods: { methods: {
observe, observe,
@ -114,4 +123,4 @@
} }
} }
} }
</script> </script>

View file

@ -29,7 +29,7 @@
let { scrollTop } = this.store.get() let { scrollTop } = this.store.get()
let scrollContainer = getScrollContainer() let scrollContainer = getScrollContainer()
if (scrollTop > 0) { if (scrollTop > 0) {
this.store.observe('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight => { this.observe('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight => {
console.log('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight) console.log('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight)
let { initializedScrollTop } = this.get() let { initializedScrollTop } = this.get()
if (!initializedScrollTop && allVisibleItemsHaveHeight) { if (!initializedScrollTop && allVisibleItemsHaveHeight) {
@ -46,7 +46,7 @@
}) })
} else { } else {
this.fire('noNeedToScroll') this.fire('noNeedToScroll')
this.store.observe('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight => { this.observe('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight => {
if (allVisibleItemsHaveHeight) { if (allVisibleItemsHaveHeight) {
console.log('initialized VirtualList') console.log('initialized VirtualList')
this.fire('initialized') this.fire('initialized')
@ -110,6 +110,10 @@
offsetHeight: getOffsetHeight() offsetHeight: getOffsetHeight()
}) })
} }
},
computed: {
// TODO: bug in svelte/store the observer in oncreate() never get removed without this hack
allVisibleItemsHaveHeight: ({ $allVisibleItemsHaveHeight }) => $allVisibleItemsHaveHeight
} }
} }
</script> </script>

View file

@ -1,7 +1,6 @@
import { mark, stop } from '../../_utils/marks' import { mark, stop } from '../../_utils/marks'
import { RealmStore } from '../../_utils/RealmStore' import { RealmStore } from '../../_utils/RealmStore'
import { reselect } from '../../_utils/reselect' import { reselect } from '../../_utils/reselect'
import { observe } from 'svelte-extras'
const RENDER_BUFFER_FACTOR = 2.5 const RENDER_BUFFER_FACTOR = 2.5
@ -11,8 +10,6 @@ class VirtualListStore extends RealmStore {
} }
} }
VirtualListStore.prototype.observe = observe
const virtualListStore = new VirtualListStore() const virtualListStore = new VirtualListStore()
virtualListStore.computeForRealm('items', null) virtualListStore.computeForRealm('items', null)