data.coop/pinafore
8
0
Fork 0
Code Issues 1 Pull requests Packages Projects Releases Wiki Activity

refactor virtual list

Browse source
This commit is contained in:
Nolan Lawson 2018-02-13 09:15:10 -08:00
parent c7e4c5cc80
commit 93635fee6a
2 changed files with 11 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
routes/_components/timeline/Timeline.html
View file

@ -21,6 +21,7 @@
:headerProps :headerProps
on:scrollToBottom="onScrollToBottom()" on:scrollToBottom="onScrollToBottom()"
on:scrollToTop="onScrollToTop()" on:scrollToTop="onScrollToTop()"
on:scrollTopChanged="onScrollTopChanged(event)"
on:initializedVisibleItems="initialize()" on:initializedVisibleItems="initialize()"
/> />
{{else}} {{else}}
@ -58,7 +59,6 @@
import LoadingPage from '../LoadingPage.html' import LoadingPage from '../LoadingPage.html'
import { focusWithCapture, blurWithCapture } from '../../_utils/events' import { focusWithCapture, blurWithCapture } from '../../_utils/events'
import { showMoreItemsForCurrentTimeline } from '../../_actions/timeline' import { showMoreItemsForCurrentTimeline } from '../../_actions/timeline'
import { virtualListStore } from '../virtualList/virtualListStore' // TODO: hacky, need better way to expose scrollTop
import { scheduleIdleTask } from '../../_utils/scheduleIdleTask' import { scheduleIdleTask } from '../../_utils/scheduleIdleTask'
import { mark, stop } from '../../_utils/marks' import { mark, stop } from '../../_utils/marks'
@ -79,7 +79,8 @@
data: () => ({ data: () => ({
LoadingFooter, LoadingFooter,
MoreHeaderVirtualWrapper, MoreHeaderVirtualWrapper,
Status Status,
scrollTop: 0
}), }),
computed: { computed: {
VirtualListComponent: (timelineType) => { VirtualListComponent: (timelineType) => {
@ -156,6 +157,9 @@
console.log('timeline initialize()') console.log('timeline initialize()')
initializeTimeline() initializeTimeline()
}, },
onScrollTopChanged(scrollTop) {
this.set({scrollTop: scrollTop})
},
onScrollToBottom() { onScrollToBottom() {
if (!this.store.get('initialized') || if (!this.store.get('initialized') ||
this.store.get('runningUpdate') || this.store.get('runningUpdate') ||
@ -181,7 +185,7 @@
return return
} }
mark('handleItemIdsToAdd') mark('handleItemIdsToAdd')
let scrollTop = virtualListStore.get('scrollTop') let scrollTop = this.get('scrollTop')
let shouldShowHeader = this.store.get('shouldShowHeader') let shouldShowHeader = this.store.get('shouldShowHeader')
let showHeader = this.store.get('showHeader') let showHeader = this.store.get('showHeader')
//console.log('handleItemIdsToAdd', (itemIdsToAdd && itemIdsToAdd.length) || 0) //console.log('handleItemIdsToAdd', (itemIdsToAdd && itemIdsToAdd.length) || 0)

7
routes/_components/virtualList/VirtualList.html
View file

@ -78,8 +78,9 @@
} }
}) })
this.observe('distanceFromTop', (distanceFromTop) => { this.observe('scrollTop', (scrollTop) => {
if (distanceFromTop === 0) { this.fire('scrollTopChanged', scrollTop)
if (scrollTop === 0) {
this.fireScrollToTop() this.fireScrollToTop()
} }
}) })
@ -98,7 +99,7 @@
distanceFromBottom: ($scrollHeight, $scrollTop, $offsetHeight) => { distanceFromBottom: ($scrollHeight, $scrollTop, $offsetHeight) => {
return $scrollHeight - $scrollTop - $offsetHeight return $scrollHeight - $scrollTop - $offsetHeight
}, },
distanceFromTop: ($scrollTop) => $scrollTop, scrollTop: ($scrollTop) => $scrollTop,
// TODO: bug in svelte store, shouldn't need to do this // TODO: bug in svelte store, shouldn't need to do this
allVisibleItemsHaveHeight: ($allVisibleItemsHaveHeight) => $allVisibleItemsHaveHeight, allVisibleItemsHaveHeight: ($allVisibleItemsHaveHeight) => $allVisibleItemsHaveHeight,
// TODO: hack to avoid getting called too often // TODO: hack to avoid getting called too often